Webentwicklung mit Frameworks: Interaktive Lernquizzes für Informatik-Studierende

Question 1

Welche drei Hauptkomponenten bilden das Bootstrap-Framework?

Accepted Answer

Grid-System, Komponenten, JavaScript-Bibliothek

Answer

Layout-Stile, Typografie, Symbole

Answer

Animationen, Effekte, Formularelemente

Answer

Kopfzeile, Fußzeile, Menü

Question 2

Welches Framework dient zur Erstellung responsiver Layouts?

Accepted Answer

Bootstrap

Answer

React

Answer

jQuery

Answer

Angular

Question 3

Wie wird in React die Komponente mit dem zugehörigen Zustand verbunden?

Accepted Answer

useState

Answer

setState

Answer

useRef

Answer

useMemo

Question 4

Welches Attribut übergibt Eigenschaften an eine React-Komponente?

Accepted Answer

props

Answer

state

Answer

params

Answer

args

Question 5

Wie wird in CSS die Hintergrundfarbe eines Elements festgelegt?

Accepted Answer

background-color

Answer

color

Answer

fill

Answer

background

Question 6

Welches Bootstrap-Rastermodell ermöglicht eine responsive Gestaltung für verschiedene Bildschirmgrößen?

Accepted Answer

12-Spalten-Raster

Answer

960 Grid System

Answer

Flexbox-Raster

Answer

Inline-Block-Raster

Question 7

Bootstrap ist ein Framework, das hauptsächlich für welchen Zweck verwendet wird?

Accepted Answer

Entwicklung responsiver Websites

Answer

Testen von Webanwendungen

Answer

Entwicklung mobiler Anwendungen

Answer

Erstellung von Datenbanken

Question 8

Welches Element wird in React verwendet, um Daten an Unterkomponenten zu übergeben?

Accepted Answer

Props

Answer

State

Answer

Refs

Answer

Context

Question 9

Welcher Befehl wird verwendet, um eine neue React-Anwendung zu erstellen?

Accepted Answer

npx create-react-app

Answer

create-react-app

Answer

react-app create

Answer

npm init react-app

Question 10

Welches Designmuster wird in React zur Verwaltung des Anwendungszustands verwendet?

Accepted Answer

Redux

Answer

MVC

Answer

Flux

Answer

MVVM

Question 11

Welche Aufgabe erfüllt die virtuelle DOM in React?

Accepted Answer

Optimierung der Aktualisierungsleistung

Answer

Vereinfachung des Testens

Answer

Verbesserung der Plattformkompatibilität

Answer

Erhöhung der Sicherheit

Question 12

Welche Methode wird verwendet, um eine React-Komponente in einem übergeordneten Element darzustellen?

Accepted Answer

ReactDOM.render

Answer

ReactDOM.append

Answer

ReactDOM.create

Answer

ReactDOM.mount

Question 13

Mit welchem React-Hook kann der Status einer Komponente verwaltet werden?

Accepted Answer

useState()

Answer

useEffect()

Answer

useContext()

Question 14

Welches Attribut wird in Bootstrap verwendet, um einem Element eine Hintergrundfarbe zuzuweisen?

Accepted Answer

background-color

Answer

bg-color

Answer

color

Question 15

Welche Funktion hat das React-Lifecycle-Event `componentDidMount()`?

Accepted Answer

Führt Aktionen aus, wenn die Komponente in das DOM eingefügt wird

Answer

Führt Aktionen aus, bevor die Komponente im DOM gerendert wird

Answer

Führt Aktionen aus, wenn die Komponente aktualisiert wird

Question 16

Welche Technik ermöglicht es in der Webentwicklung, Daten asynchron zu laden und zu verarbeiten?

Accepted Answer

AJAX

Answer

JSON

Answer

REST

Question 17

Welches Bootstrap-Rasterlayout unterteilt die Breite eines Elements in 12 gleichmäßige Spalten?

Accepted Answer

Col

Answer

Container

Answer

Row

Question 18

Welcher npm-Befehl wird verwendet, um ein neues React-Projekt zu erstellen?

Accepted Answer

npm create-react-app [Projektname]

Answer

npm install react

Answer

npm init react

Answer

npm start react

Question 19

Welche Phase des React-Komponenten-Lebenszyklus wird ausgeführt, wenn eine Komponente aus dem DOM entfernt wird?

Accepted Answer

componentWillUnmount

Answer

componentDidMount

Answer

componentWillUpdate

Answer

shouldComponentUpdate

Question 20

Welche der folgenden Methoden wird verwendet, um Daten an eine React-Komponente zu übergeben?

Accepted Answer

props

Answer

state

Answer

context

Answer

ref

Question 21

Welcher Befehl wird verwendet, um eine React-Entwicklungsumgebung zu starten?

Accepted Answer

react-scripts start

Answer

npm start

Answer

node start

Answer

webpack start

Question 22

Welcher Befehl wird verwendet, um ein neues Projekt mit der React-Kommandozeilenschnittstelle (CLI) zu erstellen?

Accepted Answer

npx create-react-app [Projektname]

Answer

react-create-app [Projektname]

Answer

npm create react-app [Projektname]

Answer

react init [Projektname]

Question 23

Welches Framework wird in dieser Einheit für die Erstellung reaktionsschneller Webseiten gelehrt?

Accepted Answer

Bootstrap

Answer

jQuery

Answer

React

Answer

Angular

Question 24

Welches Grid-System bietet Bootstrap für das Anordnen von Elementen auf einer Webseite?

Accepted Answer

Ein 12-Spalten-Raster

Answer

Ein 9-Spalten-Raster

Answer

Ein 16-Spalten-Raster

Answer

Kein Grid-System

Question 25

Welche Komponente von React wird verwendet, um den Zustand einer Anwendung zu verwalten?

Accepted Answer

Zustand

Answer

Komponente

Answer

Eigenschaften

Answer

Handler

Question 26

Welche der folgenden Aussagen zur Ereignisbehandlung in React ist richtig?

Accepted Answer

Ereignisse werden über eine spezielle React-API behandelt.

Answer

Ereignisse werden über HTML-Attribute wie "onclick" behandelt.

Answer

Ereignisse werden über JavaScript-Handler behandelt.

Answer

Ereignisse werden in React nicht behandelt.

Question 27

Welche Eigenschaft von React ermöglicht es Komponenten, Daten untereinander auszutauschen?

Accepted Answer

Props

Answer

State

Answer

Context

Answer

Dependency Injection

Question 28

Welches der folgenden Frontend-Frameworks wird zur Erstellung responsiver Webseiten eingesetzt?

Accepted Answer

Bootstrap

Answer

React

Answer

Flask

Answer

Django

Question 29

Welche Komponente in React ermöglicht die Zustandsverwaltung und löst Aktualisierungen in der Benutzeroberfläche aus?

Accepted Answer

Hook

Answer

Klasse

Answer

Funktion

Answer

Prop

Question 30

Welcher CSS-Selektor wählt alle Elemente mit der Klasse "container" aus?

Accepted Answer

.container

Answer

#container

Answer

container

Answer

div.container

Question 31

Welche HTTP-Methode wird zum Abrufen von Daten von einem Server verwendet?

Accepted Answer

GET

Answer

POST

Answer

PUT

Answer

DELETE

Question 32

Welcher Begriff beschreibt den Zustand, in dem ein Webserver Daten an einen Client sendet?

Accepted Answer

Response

Answer

Request

Answer

Route

Answer

Component

Question 33

Welche JavaScript-Methode wird genutzt, um eine Verzögerung in der Codeausführung zu erzeugen?

Accepted Answer

setTimeout()

Answer

setInterval()

Answer

waitFor()

Answer

delay()

Question 34

Welches Framework wird für die serverseitige Entwicklung von Webanwendungen eingesetzt?

Accepted Answer

Django

Answer

React

Answer

Bootstrap

Answer

Vue.js

Question 35

Welche Deklarationsweise ist in JavaScript gültig, um eine Variable zu definieren?

Accepted Answer

var x

Answer

int x

Answer

def x

Answer

integer x

Question 36

Welcher Begriff bezeichnet in einer Webanwendung einen Abschnitt, der für eine bestimmte Aufgabe zuständig ist?

Accepted Answer

Komponente

Answer

Modul

Answer

Dienst

Answer

Controller

Question 37

Welche Browser-API ermöglicht den Zugriff auf den geografischen Standort des Nutzers?

Accepted Answer

geolocation

Answer

navigator

Answer

window

Answer

document

Question 38

Welche sind die drei Hauptvorteile der Verwendung von Webentwicklungs-Frameworks?

Accepted Answer

Wiederverwendbare Komponenten, Standardisierung und verbesserte Sicherheit

Answer

Schnellere Entwicklung, geringere Komplexität und höhere Flexibilität

Answer

Erweiterte Funktionalität, optimierte Leistung und verbesserte Benutzerfreundlichkeit

Answer

Reduzierte Kosten, einfachere Wartung und bessere Skalierbarkeit

Question 39

Welches der folgenden Frameworks ist ein responsives CSS-Framework?

Accepted Answer

Bootstrap

Answer

Django (Web-Framework)

Answer

React (JavaScript-Bibliothek)

Answer

Angular (JavaScript-Framework)

Question 40

Welches der folgenden Konzepte ist ein zentraler Bestandteil von React?

Accepted Answer

Komponentensystem

Answer

Server-Side-Rendering

Answer

MVC-Architektur

Answer

Ereignisgesteuerte Programmierung

Question 41

Was ist der Hauptvorteil der Verwendung von Frameworks in der Webentwicklung?

Accepted Answer

Wiederverwendbarkeit von Code und schnellere Entwicklungszeit

Answer

Suchmaschinenoptimierung

Answer

Geringere Wartungsaufwände

Answer

Erhöhte Sicherheit

Question 42

Welches Element ist **kein** Teil der Bootstrap-Gitterstruktur?

Accepted Answer

Flexbox

Answer

Spalten

Answer

Zeilen

Answer

Startklassen

Question 43

Welches Attribut wird verwendet, um den Zustand eines React-Komponenten-States zu ändern?

Accepted Answer

setState

Answer

getInitialState

Answer

props

Answer

forceUpdate

Question 44

Welches der folgenden Elemente ist **kein** Ereignistyp in React?

Accepted Answer

onHover

Answer

onClick

Answer

onSubmit

Answer

onChange

Question 45

Für welchen Zweck dient der 'useEffect'-Hook in React?

Accepted Answer

Ausführung von Nebenwirkungen bei Änderungen des Komponentenlebenszyklus

Answer

Formularvalidierung

Answer

Komponentennavigation

Answer

Zustandsverwaltung

Question 46

Welches Attribut wird verwendet, um einen Bootstrap-Spaltenoffset festzulegen?

Accepted Answer

offset-md-3

Answer

pull-md-3

Answer

margin-md-3

Answer

push-md-3

Question 47

Welches Tool wird zum Bündeln von React-Anwendungen verwendet?

Accepted Answer

Webpack

Answer

Babel (JavaScript-Compiler)

Answer

Gulp (Build-Tool)

Answer

NPM (Paketmanager)

Question 48

Welches Framework ist speziell für die Erstellung responsiver Websites konzipiert?

Accepted Answer

Bootstrap

Answer

Django

Answer

Spring Boot

Answer

Angular

Question 49

Welche React-Komponente ermöglicht die Verwaltung des Applikationszustands?

Accepted Answer

useState

Answer

useContext

Answer

useRef

Answer

useEffect

Question 50

Welcher CSS-Präprozessor wird von Bootstrap eingesetzt?

Accepted Answer

Sass

Answer

Jade

Answer

Stylus

Answer

Less

Question 51

Welches Attribut wird in React verwendet, um Event-Listener an Elemente zu binden?

Accepted Answer

onClick

Answer

handler

Answer

onclick

Answer

on-click

Question 52

Welche React-Komponente eignet sich zum Rendern von Listen?

Accepted Answer

map

Answer

for

Answer

reduce

Answer

forEach

Question 53

Welches Bootstrap-Layout dient zur horizontalen Anordnung von Elementen?

Accepted Answer

row

Answer

grid

Answer

container

Answer

column

Question 54

Welches React-Lifecycle-Event wird beim ersten Rendern einer Komponente ausgelöst?

Accepted Answer

componentDidMount

Answer

componentWillMount

Answer

shouldComponentUpdate

Question 55

Welcher HTML-Tag wird in React verwendet, um auf eine Komponente zu verweisen?

Accepted Answer

ref

Answer

id

Answer

name

Answer

class

Question 56

Welches Framework ist auf die schnelle und einfache Erstellung responsiver Websites spezialisiert?

Accepted Answer

Bootstrap

Answer

Angular

Answer

Vue.js

Answer

Svelte

Question 57

Welcher Hauptvorteil ergibt sich aus der Verwendung von React?

Accepted Answer

Komponentenbasierte Architektur

Answer

Umfassende Dokumentation

Answer

Vereinfachte Debugging-Optionen

Answer

Schnellere Ladezeiten

Question 58

Welche der folgenden Aussagen zu Frameworks in der Webentwicklung ist zutreffend?

Accepted Answer

Frameworks können die Entwicklungszeit reduzieren und die Codequalität verbessern.

Answer

Frameworks erschweren die Anpassung von Websites an individuelle Anforderungen.

Answer

Frameworks sind ausschließlich für erfahrene Entwickler geeignet.

Question 59

Welcher Befehl wird im Terminal verwendet, um ein neues React-Projekt zu erstellen?

Accepted Answer

npx create-react-app

Answer

react-new

Answer

create-react-project

Answer

react-init

Question 60

Welche Bootstrap-Komponente wird für die Erstellung von Navigationsmenüs verwendet?

Accepted Answer

Navbar

Answer

Button

Answer

Alert

Answer

Card

Question 61

Welche Funktion erfüllt das 'state'-Objekt in React?

Accepted Answer

Verwaltung dynamischer Daten, die die Darstellung einer Komponente beeinflussen.

Answer

Initialisierung von Klassenattributen

Answer

Speichern globaler Variablen

Question 62

Welcher Ansatz wird in React zur Behandlung von Benutzerinteraktionen verwendet?

Accepted Answer

Ereignisbehandlung

Answer

Abhängigkeitsinjektion

Answer

Statusänderung

Answer

Datenbindung

Question 63

Was ist der Hauptzweck des 'useEffect'-Hooks in React?

Accepted Answer

Ausführen von Nebenwirkungen wie API-Aufrufen, Abonnements und Bereinigungen.

Answer

Ändern von Komponentendaten

Answer

Verwalten des Lebenszyklus einer Komponente

Question 64

Welcher der folgenden Aspekte ist KEIN Vorteil der Verwendung von Frameworks in der Webentwicklung?

Accepted Answer

Code sofort fehlerfrei bereitstellen.

Answer

Verbesserte Code-Struktur und Wartbarkeit.

Answer

Beschleunigte Entwicklungsgeschwindigkeit.