https://github.com/aiherrera/blogpost-animations-in-rn-with-animatable
https://github.com/aiherrera/blogpost-animations-in-rn-with-animatable
Last synced: about 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/aiherrera/blogpost-animations-in-rn-with-animatable
- Owner: aiherrera
- Created: 2023-09-03T01:52:13.000Z (over 1 year ago)
- Default Branch: development
- Last Pushed: 2023-09-03T01:52:14.000Z (over 1 year ago)
- Last Synced: 2025-03-24T16:21:28.643Z (2 months ago)
- Language: TypeScript
- Size: 118 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: Readme.md
Awesome Lists containing this project
README
# React Native Expo project preconfigured with NativeWind, React Native Paper and Prettier
This is a React Native Expo template preconfigured with [NativeWind](https://www.nativewind.dev/), [React Native Paper](https://callstack.github.io/react-native-paper/), and [Prettier](https://prettier.io/). NativeWind NativeWind uses Tailwind CSS as scripting language to create a universal style system for React Native, while React Native Paper is a Cross-platform Material Design for React Native. Prettier is a code formatter that helps ensure consistent code formatting across the project.
_This project is a Tab based starter._
## Installation
1. Clone the repository to your local machine.
2. Install dependencies by running `npm install` or `yarn`.
3. Start the development server by running `npm start` or `yarn start`.
## Project Structure
```
project
├── app
│ ├── (tabs)
│ │ ├── _layout
│ │ ├── index.tsx
│ │ └── two.tsx
│ ├── _layout.tsx
│ ├── [...missing].tsx
│ └── modal.tsx
├── assets
│ ├── fonts
│ └── images
├── components
│ ├── ExternalLink.tsx
│ ├── StyledText.tsx
│ └── Themed.tsx
├── constants
│ └── Colors.tsx
├── .gitignore
├── .prettierignore
├── .prettierrc
├── app.json
├── babel.config.js
├── index.ts
├── nativewind.d.ts
├── package-lock.json
├── package.json
├── README.md
├── tailwind.config.js
└── tsconfig.json
```
## Usage
### Tailwinds
Tailwinds comes preconfigured in this template, so no additional configuration needs to be done in order to start using it.
```jsx
import { View, Text } from 'react-native'
const MyComponent = () => {
return (
Hello World!
)
}
```
### React Native Paper
To use React Native Paper, import it at the top of the file and use its components as necessary:
```jsx
import { Button } from 'react-native-paper'
import { Alert } from 'react-native'
const MyComponent = () => {
return (
Alert.alert('Paper button is working!')}>
Paper button
)
}
```
### Prettier
Prettier is preconfigured with this project to format the code on save. You can modify the Prettier configuration by editing the `.prettierrc` file.
## License
This project is licensed under the MIT License.