Usefull Operations In React Native App Development
Table Of Contents:
- How To Show The Effects Of Changes Made In App.tsx File?
- How To Increase The Text Size In VS Code?
- How To Add Comments In VS Code?
- How To Use Google Fonts In React Native?
(1) How To Show The Effects Of Changes Made In App.tsx File?
- Open your android Emulator and use the below command to refresh the page.
(2) How To Increase The Text Size In VS Code?
(3) How To Add Comments In VS Code?
// Import necessary dependencies
import React, { useState, useEffect } from "react";
import { View, Text } from "react-native";
import SplashScreen from "./src/screens/SplashScreen";
import RNBootSplash from "react-native-bootsplash";
/*
This component handles the app's splash screen sequence:
1. It first shows the native splash using `react-native-bootsplash`.
2. Once hidden, it displays the Lottie animation.
3. After the animation finishes, it renders the main app UI.
*/
const App: React.FC = () => {
const [isBootSplashHidden, setIsBootSplashHidden] = useState(false);
const [isLottieFinished, setIsLottieFinished] = useState(false);
/**
* The main application component that manages the splash screen flow.
* @returns The splash screen followed by the main app content.
*/
const App: React.FC = () => {
useEffect(() => {
// Hide the native splash screen and update state when it's done
RNBootSplash.hide({ fade: true }).then(() => setIsBootSplashHidden(true));
}, []);
(4) How To Use Google Fonts In React Native?
