Bewerbungsfragen für Junior React Native Entwickler: Der komplette Leitfaden

Einführung

React Native ermöglicht es Entwicklern, native mobile Anwendungen mit JavaScript und React zu erstellen. Mit einer einzigen Codebasis können Sie Apps sowohl für iOS als auch für Android erstellen, was es zu einer leistungsstarken Wahl für die plattformübergreifende mobile Entwicklung macht.

Dieser Leitfaden behandelt wichtige Interviewfragen für Junior React Native Entwickler. Wir werden React-Grundlagen, Komponenten, Hooks, Navigation, State Management und mobile-spezifische Konzepte untersuchen, um Ihnen bei der Vorbereitung auf Ihre erste React Native Entwicklerrolle zu helfen.

React Grundlagen (6 Fragen)

1. Was ist React Native und wie unterscheidet es sich von React?

Antwort:

React: JavaScript-Bibliothek zum Erstellen von Web-Benutzeroberflächen
React Native: Framework zum Erstellen nativer mobiler Apps mit React
Hauptunterschiede:
- React Native rendert auf native Komponenten (nicht DOM)
- Verwendet native APIs anstelle von Web-APIs
- Unterschiedlicher Styling-Ansatz (kein CSS, verwendet StyleSheet)
- Plattformspezifischer Code für iOS und Android

// React (Web)
import React from 'react';

function App() {
  return <div className="container">Hello Web</div>;
}

// React Native (Mobile)
import React from 'react';
import { View, Text, StyleSheet } from 'react-native';

function App() {
  return (
    <View style={styles.container}>
      <Text>Hello Mobile</Text>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
});

Seltenheit: Sehr verbreitet Schwierigkeit: Leicht

2. Was sind die Kernkomponenten in React Native?

Antwort: React Native bietet integrierte Komponenten, die nativen UI-Elementen zugeordnet sind:

View: Container-Komponente (wie div im Web)
Text: Text anzeigen (gesamter Text muss in der Text-Komponente stehen)
Image: Bilder anzeigen
ScrollView: Scrollbarer Container
TextInput: Texteingabefeld
TouchableOpacity/Pressable: Berührbare Elemente
FlatList: Effizientes Listen-Rendering
Button: Grundlegende Button-Komponente

import {
  View,
  Text,
  Image,
  TextInput,
  TouchableOpacity,
  StyleSheet,
} from 'react-native';

function MyComponent() {
  return (
    <View style={styles.container}>
      <Text style={styles.title}>Welcome</Text>
      <Image source={{ uri: 'https://example.com/image.jpg' }} style={styles.image} />
      <TextInput placeholder="Enter name" style={styles.input} />
      <TouchableOpacity style={styles.button} onPress={() => console.log('Pressed')}>
        <Text style={styles.buttonText}>Click Me</Text>
      </TouchableOpacity>
    </View>
  );
}

Seltenheit: Sehr verbreitet Schwierigkeit: Leicht

3. Erklären Sie den Unterschied zwischen `View` und `ScrollView`.

Antwort:

View: Statischer Container. Inhalte außerhalb der Bildschirmgrenzen sind nicht scrollbar.
ScrollView: Scrollbarer Container. Rendert alle Kinder auf einmal (kann speicherintensiv für große Listen sein).
Wann zu verwenden:
- View: Für Layouts, die auf den Bildschirm passen
- ScrollView: Für kleine Mengen scrollbaren Inhalts
- FlatList: Für große Listen (rendert nur sichtbare Elemente)

// View - nicht scrollbar
<View style={{ height: 200 }}>
  <Text>Content 1</Text>
  <Text>Content 2</Text>
  {/* Wenn der Inhalt 200px überschreitet, wird er abgeschnitten */}
</View>

// ScrollView - scrollbar
<ScrollView style={{ height: 200 }}>
  <Text>Content 1</Text>
  <Text>Content 2</Text>
  <Text>Content 3</Text>
  {/* Kann scrollen, um alle Inhalte anzuzeigen */}
</ScrollView>

// FlatList - effizient für große Listen
<FlatList
  data={items}
  renderItem={({ item }) => <Text>{item.name}</Text>}
  keyExtractor={item => item.id}
/>

Seltenheit: Sehr verbreitet Schwierigkeit: Leicht

4. Was sind React Hooks und welche werden am häufigsten verwendet?

Antwort: Hooks sind Funktionen, mit denen Sie Status- und Lebenszyklusfunktionen in funktionalen Komponenten verwenden können.

Häufige Hooks:
- useState: Verwalten des Komponentenstatus
- useEffect: Behandeln von Nebenwirkungen (Datenabruf, Abonnements)
- useContext: Zugriff auf Kontextwerte
- useCallback: Memoisiert Funktionen
- useMemo: Memoisiert teure Berechnungen
- useRef: Referenziert DOM-Elemente oder speichert Werte

import React, { useState, useEffect } from 'react';
import { View, Text, Button } from 'react-native';

function Counter() {
  const [count, setCount] = useState(0);
  
  useEffect(() => {
    console.log(`Count changed to: ${count}`);
    
    // Cleanup function
    return () => {
      console.log('Cleanup');
    };
  }, [count]); // Runs when count changes
  
  return (
    <View>
      <Text>Count: {count}</Text>
      <Button title="Increment" onPress={() => setCount(count + 1)} />
    </View>
  );
}

Seltenheit: Sehr verbreitet Schwierigkeit: Leicht

5. Erklären Sie den `useEffect`-Hook und sein Abhängigkeitsarray.

Antwort: useEffect führt nach dem Rendern Nebenwirkungen aus. Das Abhängigkeitsarray steuert, wann es ausgeführt wird:

Kein Array: Wird nach jedem Rendern ausgeführt
Leeres Array []: Wird einmal nach dem ersten Rendern ausgeführt
Mit Abhängigkeiten [dep1, dep2]: Wird ausgeführt, wenn sich Abhängigkeiten ändern

import { useEffect, useState } from 'react';

function UserProfile({ userId }) {
  const [user, setUser] = useState(null);
  
  // Runs once on mount
  useEffect(() => {
    console.log('Component mounted');
  }, []);
  
  // Runs when userId changes
  useEffect(() => {
    fetchUser(userId).then(data => setUser(data));
  }, [userId]);
  
  // Runs after every render (avoid this)
  useEffect(() => {
    console.log('Rendered');
  });
  
  // Cleanup function
  useEffect(() => {
    const subscription = subscribeToUpdates();
    
    return () => {
      subscription.unsubscribe(); // Cleanup on unmount
    };
  }, []);
  
  return <Text>{user?.name}</Text>;
}

Seltenheit: Sehr verbreitet Schwierigkeit: Mittel

6. Was ist das Virtual DOM und wie verwendet React es?

Antwort: Das Virtual DOM ist eine leichtgewichtige JavaScript-Darstellung des tatsächlichen DOM.

Prozess:
1. Wenn sich der Status ändert, erstellt React einen neuen Virtual DOM-Baum
2. Vergleicht ihn mit dem vorherigen Virtual DOM (Diffing)
3. Berechnet die minimal erforderlichen Änderungen
4. Aktualisiert nur geänderte Teile im realen DOM
Vorteile: Effiziente Aktualisierungen, bessere Leistung

Seltenheit: Häufig Schwierigkeit: Leicht

Komponenten & Props (4 Fragen)

7. Was ist der Unterschied zwischen Props und State?

Antwort:

Props:
- Von Eltern an Kinder weitergegeben
- Schreibgeschützt (unveränderlich)
- Wird für die Komponentenkonfiguration verwendet
State:
- Innerhalb der Komponente verwaltet
- Veränderlich (kann geändert werden)
- Wird für dynamische Daten verwendet

// Parent component
function ParentComponent() {
  const [count, setCount] = useState(0);
  
  return (
    <ChildComponent 
      title="Counter"  // Props
      count={count}    // Props
      onIncrement={() => setCount(count + 1)}  // Props
    />
  );
}

// Child component
function ChildComponent({ title, count, onIncrement }) {
  // Cannot modify props
  // title = "New Title"; // Error!
  
  return (
    <View>
      <Text>{title}</Text>
      <Text>Count: {count}</Text>
      <Button title="Increment" onPress={onIncrement} />
    </View>
  );
}

Seltenheit: Sehr verbreitet Schwierigkeit: Leicht

8. Was sind funktionale Komponenten vs. Klassenkomponenten?

Antwort:

Funktionale Komponenten:
- Einfachere Syntax
- Verwenden Sie Hooks für Status und Lebenszyklus
- Bevorzugt im modernen React
Klassenkomponenten:
- Älterer Ansatz
- Verwenden Sie this.state und Lebenszyklusmethoden
- Wird weiterhin unterstützt, ist aber weniger verbreitet

// Functional Component (Modern)
function Welcome({ name }) {
  const [count, setCount] = useState(0);
  
  useEffect(() => {
    console.log('Mounted');
  }, []);
  
  return <Text>Hello, {name}</Text>;
}

// Class Component (Legacy)
class Welcome extends React.Component {
  constructor(props) {
    super(props);
    this.state = { count: 0 };
  }
  
  componentDidMount() {
    console.log('Mounted');
  }
  
  render() {
    return <Text>Hello, {this.props.name}</Text>;
  }
}

Seltenheit: Häufig Schwierigkeit: Leicht

9. Wie übergeben Sie Daten von einer Kind- an eine Elternkomponente?

Antwort: Verwenden Sie Callback-Funktionen, die als Props übergeben werden.

// Parent component
function ParentComponent() {
  const [message, setMessage] = useState('');
  
  const handleMessageFromChild = (msg) => {
    setMessage(msg);
  };
  
  return (
    <View>
      <Text>Message from child: {message}</Text>
      <ChildComponent onSendMessage={handleMessageFromChild} />
    </View>
  );
}

// Child component
function ChildComponent({ onSendMessage }) {
  const [input, setInput] = useState('');
  
  const sendMessage = () => {
    onSendMessage(input); // Call parent's function
  };
  
  return (
    <View>
      <TextInput value={input} onChangeText={setInput} />
      <Button title="Send to Parent" onPress={sendMessage} />
    </View>
  );
}

Seltenheit: Sehr verbreitet Schwierigkeit: Leicht

10. Was ist der `key`-Prop und warum ist er wichtig?

Antwort: Der key-Prop hilft React zu identifizieren, welche Elemente in Listen geändert, hinzugefügt oder entfernt wurden.

Zweck: Optimieren der Rendering-Leistung
Anforderungen: Muss unter Geschwistern eindeutig und stabil sein (verwenden Sie keinen Index, wenn sich die Liste ändern kann)

// Good - using unique ID
function UserList({ users }) {
  return (
    <FlatList
      data={users}
      keyExtractor={item => item.id} // Unique key
      renderItem={({ item }) => <Text>{item.name}</Text>}
    />
  );
}

// Bad - using index (avoid if list can change)
function BadList({ items }) {
  return (
    <View>
      {items.map((item, index) => (
        <Text key={index}>{item}</Text> // Don't use index
      ))}
    </View>
  );
}

// Good - using unique property
function GoodList({ items }) {
  return (
    <View>
      {items.map(item => (
        <Text key={item.id}>{item.name}</Text>
      ))}
    </View>
  );
}

Seltenheit: Sehr verbreitet Schwierigkeit: Leicht

Styling & Layout (3 Fragen)

11. Wie gestalten Sie Komponenten in React Native?

Antwort: React Native verwendet JavaScript-Objekte für das Styling, nicht CSS.

StyleSheet API: Erstellen Sie optimierte Stile
Inline Styles: Direkte Style-Objekte (weniger performant)
Flexbox: Standard-Layoutsystem

import { View, Text, StyleSheet } from 'react-native';

function StyledComponent() {
  return (
    <View style={styles.container}>
      <Text style={styles.title}>Title</Text>
      <Text style={[styles.text, styles.bold]}>Multiple styles</Text>
      <Text style={{ color: 'red' }}>Inline style</Text>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    padding: 20,
    backgroundColor: '#fff',
  },
  title: {
    fontSize: 24,
    fontWeight: 'bold',
    color: '#333',
  },
  text: {
    fontSize: 16,
    color: '#666',
  },
  bold: {
    fontWeight: 'bold',
  },
});

Seltenheit: Sehr verbreitet Schwierigkeit: Leicht

12. Erklären Sie Flexbox in React Native.

Antwort: Flexbox ist das primäre Layoutsystem in React Native.

Haupteigenschaften:
- flexDirection: row oder column (Standard: column)
- justifyContent: Ausrichten entlang der Hauptachse
- alignItems: Ausrichten entlang der Querachse
- flex: Proportionale Größenanpassung

const styles = StyleSheet.create({
  container: {
    flex: 1,
    flexDirection: 'row', // Horizontales Layout
    justifyContent: 'space-between', // Elemente gleichmäßig verteilen
    alignItems: 'center', // Vertikal zentrieren
  },
  box1: {
    flex: 1, // Nimmt 1/3 des Platzes ein
    backgroundColor: 'red',
  },
  box2: {
    flex: 2, // Nimmt 2/3 des Platzes ein
    backgroundColor: 'blue',
  },
});

function FlexExample() {
  return (
    <View style={styles.container}>
      <View style={styles.box1} />
      <View style={styles.box2} />
    </View>
  );
}

Seltenheit: Sehr verbreitet Schwierigkeit: Mittel

13. Was ist der Unterschied zwischen `margin` und `padding`?

Antwort:

Padding: Raum innerhalb der Komponente (zwischen Inhalt und Rahmen)
Margin: Raum außerhalb der Komponente (zwischen Komponente und Nachbarn)

const styles = StyleSheet.create({
  box: {
    margin: 20,        // Raum außerhalb
    padding: 10,       // Raum innerhalb
    backgroundColor: 'lightblue',
  },
  // Specific sides
  specificBox: {
    marginTop: 10,
    marginBottom: 20,
    paddingLeft: 15,
    paddingRight: 15,
  },
  // Horizontal and vertical
  shorthand: {
    marginHorizontal: 20,  // left and right
    marginVertical: 10,    // top and bottom
    paddingHorizontal: 15,
    paddingVertical: 5,
  },
});

Seltenheit: Häufig Schwierigkeit: Leicht

Antwort: React Navigation ist die beliebteste Navigationsbibliothek für React Native.

Typen:
- Stack Navigator: Bildschirmstapel (Push/Pop)
- Tab Navigator: Untere Tabs
- Drawer Navigator: Seitenmenü

import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';

const Stack = createNativeStackNavigator();

function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator initialRouteName="Home">
        <Stack.Screen name="Home" component={HomeScreen} />
        <Stack.Screen name="Details" component={DetailsScreen} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

function HomeScreen({ navigation }) {
  return (
    <View>
      <Text>Home Screen</Text>
      <Button
        title="Go to Details"
        onPress={() => navigation.navigate('Details', { itemId: 42 })}
      />
    </View>
  );
}

function DetailsScreen({ route, navigation }) {
  const { itemId } = route.params;
  
  return (
    <View>
      <Text>Details Screen</Text>
      <Text>Item ID: {itemId}</Text>
      <Button title="Go Back" onPress={() => navigation.goBack()} />
    </View>
  );
}

Seltenheit: Sehr verbreitet Schwierigkeit: Mittel

15. Wie übergeben Sie Parameter zwischen Bildschirmen?

Antwort: Verwenden Sie die Funktion navigate mit einem zweiten Parameter für Daten.

// Navigate with parameters
function HomeScreen({ navigation }) {
  const user = { id: 1, name: 'John', email: '[email protected]' };
  
  return (
    <Button
      title="View Profile"
      onPress={() => navigation.navigate('Profile', { user })}
    />
  );
}

// Receive parameters
function ProfileScreen({ route }) {
  const { user } = route.params;
  
  return (
    <View>
      <Text>Name: {user.name}</Text>
      <Text>Email: {user.email}</Text>
    </View>
  );
}

// Update parameters
function EditScreen({ navigation }) {
  const updateUser = () => {
    navigation.setParams({ user: updatedUser });
  };
  
  return <Button title="Update" onPress={updateUser} />;
}

Seltenheit: Sehr verbreitet Schwierigkeit: Leicht

16. Was sind Navigationsoptionen und wie passen Sie Header an?

Antwort: Navigationsoptionen steuern das Erscheinungsbild und Verhalten des Bildschirms.

function HomeScreen({ navigation }) {
  useEffect(() => {
    navigation.setOptions({
      title: 'My Home',
      headerStyle: {
        backgroundColor: '#f4511e',
      },
      headerTintColor: '#fff',
      headerTitleStyle: {
        fontWeight: 'bold',
      },
      headerRight: () => (
        <Button title="Info" onPress={() => alert('Info')} />
      ),
    });
  }, [navigation]);
  
  return <View><Text>Home</Text></View>;
}

// Or set in navigator
<Stack.Screen
  name="Home"
  component={HomeScreen}
  options={{
    title: 'My Home',
    headerStyle: { backgroundColor: '#f4511e' },
    headerTintColor: '#fff',
  }}
/>

Seltenheit: Häufig Schwierigkeit: Leicht

Daten & Speicherung (4 Fragen)

17. Wie rufen Sie Daten von einer API in React Native ab?

Antwort: Verwenden Sie die fetch-API oder Bibliotheken wie Axios.

import { useState, useEffect } from 'react';
import { View, Text, ActivityIndicator } from 'react-native';

function UserList() {
  const [users, setUsers] = useState([]);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState(null);
  
  useEffect(() => {
    fetchUsers();
  }, []);
  
  const fetchUsers = async () => {
    try {
      const response = await fetch('https://api.example.com/users');
      
      if (!response.ok) {
        throw new Error('Network response was not ok');
      }
      
      const data = await response.json();
      setUsers(data);
    } catch (err) {
      setError(err.message);
    } finally {
      setLoading(false);
    }
  };
  
  if (loading) return <ActivityIndicator />;
  if (error) return <Text>Error: {error}</Text>;
  
  return (
    <FlatList
      data={users}
      renderItem={({ item }) => <Text>{item.name}</Text>}
      keyExtractor={item => item.id.toString()}
    />
  );
}

Seltenheit: Sehr verbreitet Schwierigkeit: Mittel

18. Was ist AsyncStorage und wie verwenden Sie es?

Antwort: AsyncStorage ist ein einfaches, asynchrones Schlüssel-Wert-Speichersystem für React Native.

Anwendungsfälle: Benutzereinstellungen, Token, kleine Daten
Nicht für: Große Datensätze, komplexe Abfragen (verwenden Sie stattdessen SQLite)

import AsyncStorage from '@react-native-async-storage/async-storage';

// Save data
const saveData = async (key, value) => {
  try {
    await AsyncStorage.setItem(key, value);
  } catch (error) {
    console.error('Error saving data:', error);
  }
};

// Save object
const saveUser = async (user) => {
  try {
    const jsonValue = JSON.stringify(user);
    await AsyncStorage.setItem('user', jsonValue);
  } catch (error) {
    console.error('Error saving user:', error);
  }
};

// Read data
const getData = async (key) => {
  try {
    const value = await AsyncStorage.getItem(key);
    return value !== null ? value : null;
  } catch (error) {
    console.error('Error reading data:', error);
  }
};

// Read object
const getUser = async () => {
  try {
    const jsonValue = await AsyncStorage.getItem('user');
    return jsonValue != null ? JSON.parse(jsonValue) : null;
  } catch (error) {
    console.error('Error reading user:', error);
  }
};

// Remove data
const removeData = async (key) => {
  try {
    await AsyncStorage.removeItem(key);
  } catch (error) {
    console.error('Error removing data:', error);
  }
};

// Clear all
const clearAll = async () => {
  try {
    await AsyncStorage.clear();
  } catch (error) {
    console.error('Error clearing storage:', error);
  }
};

Seltenheit: Sehr verbreitet Schwierigkeit: Leicht

19. Was ist der Unterschied zwischen `FlatList` und `ScrollView`?

Antwort:

ScrollView:
- Rendert alle Kinder auf einmal
- Gut für kleine Listen
- Speicherintensiv für große Listen
FlatList:
- Rendert nur sichtbare Elemente (Lazy Loading)
- Effizient für große Listen
- Integrierte Optimierungen

// ScrollView - renders everything
<ScrollView>
  {items.map(item => (
    <View key={item.id}>
      <Text>{item.name}</Text>
    </View>
  ))}
</ScrollView>

// FlatList - renders only visible items
<FlatList
  data={items}
  renderItem={({ item }) => (
    <View>
      <Text>{item.name}</Text>
    </View>
  )}
  keyExtractor={item => item.id}
  // Performance optimizations
  initialNumToRender={10}
  maxToRenderPerBatch={10}
  windowSize={5}
/>

Seltenheit: Sehr verbreitet Schwierigkeit: Leicht

20. Wie behandeln Sie Formulare und Benutzereingaben?

Antwort: Verwenden Sie gesteuerte Komponenten mit Status.

import { useState } from 'react';
import { View, TextInput, Button, Text } from 'react-native';

function LoginForm() {
  const [email, setEmail] = useState('');
  const [password, setPassword] = useState('');
  const [errors, setErrors] = useState({});
  
  const validate = () => {
    const newErrors = {};
    
    if (!email) {
      newErrors.email = 'Email is required';
    } else if (!/\S+@\S+\.\S+/.test(email)) {
      newErrors.email = 'Email is invalid';
    }
    
    if (!password) {
      newErrors.password = 'Password is required';
    } else if (password.length < 6) {
      newErrors.password = 'Password must be at least 6 characters';
    }
    
    setErrors(newErrors);
    return Object.keys(newErrors).length === 0;
  };
  
  const handleSubmit = () => {
    if (validate()) {
      console.log('Form submitted:', { email, password });
      // Submit to API
    }
  };
  
  return (
    <View>
      <TextInput
        placeholder="Email"
        value={email}
        onChangeText={setEmail}
        keyboardType="email-address"
        autoCapitalize="none"
      />
      {errors.email && <Text style={{ color: 'red' }}>{errors.email}</Text>}
      
      <TextInput
        placeholder="Password"
        value={password}
        onChangeText={setPassword}
        secureTextEntry
      />
      {errors.password && <Text style={{ color: 'red' }}>{errors.password}</Text>}
      
      <Button title="Login" onPress={handleSubmit} />
    </View>
  );
}

Seltenheit: Sehr verbreitet Schwierigkeit: Mittel

Inhaltsverzeichnis

Bewerbungsfragen für Junior React Native Entwickler: Der komplette Leitfaden

Einführung

React Grundlagen (6 Fragen)

1. Was ist React Native und wie unterscheidet es sich von React?

2. Was sind die Kernkomponenten in React Native?

3. Erklären Sie den Unterschied zwischen `View` und `ScrollView`.

4. Was sind React Hooks und welche werden am häufigsten verwendet?

5. Erklären Sie den `useEffect`-Hook und sein Abhängigkeitsarray.

6. Was ist das Virtual DOM und wie verwendet React es?

Komponenten & Props (4 Fragen)

7. Was ist der Unterschied zwischen Props und State?

8. Was sind funktionale Komponenten vs. Klassenkomponenten?

9. Wie übergeben Sie Daten von einer Kind- an eine Elternkomponente?

10. Was ist der `key`-Prop und warum ist er wichtig?

Styling & Layout (3 Fragen)

11. Wie gestalten Sie Komponenten in React Native?

12. Erklären Sie Flexbox in React Native.

13. Was ist der Unterschied zwischen `margin` und `padding`?

Navigation (3 Fragen)

14. Was ist React Navigation und wie verwenden Sie es?

15. Wie übergeben Sie Parameter zwischen Bildschirmen?

16. Was sind Navigationsoptionen und wie passen Sie Header an?

Daten & Speicherung (4 Fragen)

17. Wie rufen Sie Daten von einer API in React Native ab?

18. Was ist AsyncStorage und wie verwenden Sie es?

19. Was ist der Unterschied zwischen `FlatList` und `ScrollView`?

20. Wie behandeln Sie Formulare und Benutzereingaben?

Ihr nächstes Vorstellungsgespräch ist nur einen Lebenslauf entfernt

Diesen Beitrag teilen

Wöchentliche Karrieretipps, die wirklich funktionieren

Wöchentliche Karrieretipps, die wirklich funktionieren

Verwandte Beiträge

Bewerbungsfragen für Junior Netzwerktechniker: Der komplette Leitfaden

Vorstellungsgesprächsfragen für angehende Machine-Learning-Ingenieure: Der komplette Leitfaden

Bewerbungsfragen für angehende Security Engineers: Der komplette Leitfaden

Ihr nächstes Vorstellungsgespräch ist nur einen Lebenslauf entfernt

Diesen Beitrag teilen

Überwinden Sie die 75% ATS-Ablehnungsrate

Inhaltsverzeichnis

Einführung

React Grundlagen (6 Fragen)

1. Was ist React Native und wie unterscheidet es sich von React?

2. Was sind die Kernkomponenten in React Native?

3. Erklären Sie den Unterschied zwischen View und ScrollView.

4. Was sind React Hooks und welche werden am häufigsten verwendet?

5. Erklären Sie den useEffect-Hook und sein Abhängigkeitsarray.

6. Was ist das Virtual DOM und wie verwendet React es?

Komponenten & Props (4 Fragen)

7. Was ist der Unterschied zwischen Props und State?

8. Was sind funktionale Komponenten vs. Klassenkomponenten?

9. Wie übergeben Sie Daten von einer Kind- an eine Elternkomponente?

10. Was ist der key-Prop und warum ist er wichtig?

Styling & Layout (3 Fragen)

11. Wie gestalten Sie Komponenten in React Native?

12. Erklären Sie Flexbox in React Native.

13. Was ist der Unterschied zwischen margin und padding?

Navigation (3 Fragen)

14. Was ist React Navigation und wie verwenden Sie es?

15. Wie übergeben Sie Parameter zwischen Bildschirmen?

16. Was sind Navigationsoptionen und wie passen Sie Header an?

Daten & Speicherung (4 Fragen)

17. Wie rufen Sie Daten von einer API in React Native ab?

18. Was ist AsyncStorage und wie verwenden Sie es?

19. Was ist der Unterschied zwischen FlatList und ScrollView?

20. Wie behandeln Sie Formulare und Benutzereingaben?

Ihr nächstes Vorstellungsgespräch ist nur einen Lebenslauf entfernt

Diesen Beitrag teilen

Wöchentliche Karrieretipps, die wirklich funktionieren

Wöchentliche Karrieretipps, die wirklich funktionieren

Verwandte Beiträge

Bewerbungsfragen für Junior Netzwerktechniker: Der komplette Leitfaden

Vorstellungsgesprächsfragen für angehende Machine-Learning-Ingenieure: Der komplette Leitfaden

Bewerbungsfragen für angehende Security Engineers: Der komplette Leitfaden

Ihr nächstes Vorstellungsgespräch ist nur einen Lebenslauf entfernt

Diesen Beitrag teilen

Überwinden Sie die 75% ATS-Ablehnungsrate

3. Erklären Sie den Unterschied zwischen `View` und `ScrollView`.

5. Erklären Sie den `useEffect`-Hook und sein Abhängigkeitsarray.

10. Was ist der `key`-Prop und warum ist er wichtig?

13. Was ist der Unterschied zwischen `margin` und `padding`?

19. Was ist der Unterschied zwischen `FlatList` und `ScrollView`?