-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
FUSE-25: [PRM391] - Update README for React Native Seminar to introdu…
…ce how to use (#15) [PRM391] - Update README for React Native Seminar to introduce how to use
- Loading branch information
Showing
1 changed file
with
15 additions
and
21 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,36 +1,30 @@ | ||
| # TypeScript Example | ||
| # React Native Seminar - Users Management | ||
|
|
||
| <p> | ||
| <!-- iOS --> | ||
| <img alt="Supports Expo iOS" longdesc="Supports Expo iOS" src="https://img.shields.io/badge/iOS-4630EB.svg?style=flat-square&logo=APPLE&labelColor=999999&logoColor=fff" /> | ||
| <!-- Android --> | ||
| <img alt="Supports Expo Android" longdesc="Supports Expo Android" src="https://img.shields.io/badge/Android-4630EB.svg?style=flat-square&logo=ANDROID&labelColor=A4C639&logoColor=fff" /> | ||
| <!-- Web --> | ||
| <img alt="Supports Expo Web" longdesc="Supports Expo Web" src="https://img.shields.io/badge/web-4630EB.svg?style=flat-square&logo=GOOGLE-CHROME&labelColor=4285F4&logoColor=fff" /> | ||
| </p> | ||
|
|
||
| ```sh | ||
| npx create-react-native-app -t with-typescript | ||
| ``` | ||
|
|
||
| TypeScript is a superset of JavaScript which gives you static types and powerful tooling in Visual Studio Code including autocompletion and useful inline warnings for type errors. | ||
| ## Tech used: | ||
| <ol> | ||
| <li>TypeScript</li> | ||
| <li>Formik</li> | ||
| <li>React Navigation</li> | ||
| <li>React Native SVG</li> | ||
| <li>React Native Paper</li> | ||
| <li>Tailwind React Native</li> | ||
| <li>React Native Modals</li> | ||
| <li>React Native Heroicons</li> | ||
| </ol> | ||
|
|
||
| ## 🚀 How to use | ||
|
|
||
| #### Creating a new project | ||
| #### After cloning this project | ||
|
|
||
| - Install the CLI: `npm i -g expo-cli` | ||
| - Create a project: `npx create-react-native-app -t with-typescript` | ||
| - `cd` into the project | ||
|
|
||
| ### Adding TypeScript to existing projects | ||
|
|
||
| - Create a blank TypeScript config: `touch tsconfig.json` | ||
| - Run `expo start` to automatically configure TypeScript | ||
| - Rename files to TypeScript, `.tsx` for React components and `.ts` for plain typescript files | ||
|
|
||
| > 💡 You can disable the TypeScript setup in Expo CLI with the environment variable `EXPO_NO_TYPESCRIPT_SETUP=1 expo start` | ||
|
|
||
| ## 📝 Notes | ||
| ### Run the project | ||
|
|
||
| - [Expo TypeScript guide](https://docs.expo.dev/versions/latest/guides/typescript/) | ||
| - Run the Expo DevTools: `npm run expo:start` |