Habits

📷 Demonstration

🚀 About the project

The project consists in create a full app to manage habits

📋 Starting the application

1. Clone the repository with https://github.com/rodrigodiasf1984/nlw-setup-2023.git
2. Open a terminal and enter to cd nlw-setup-2023
3. Type code . to open the project on vscode
4. Open each project and install all dependencies with the command yarn or npm
5. cd server
6. npm run dev or yarn dev
7. Type expo start to start the mobile project
8. press i to open IOS Simulator or a to open the Android Simulator
9. cd web
10. npm run dev or yarn dev

📋 Some files architecture information

./assets -- Files that are not code subdivided according to their functionality

./components -- Files .jsx of reusable React components in more than one parent component.

./screens -- Files jsx that describe React components that represent an accessible screen.

./env -- Files .env files to load environment variables using import statements.

🔨 Tools used

Mobile

• 📄 Nativewind - uses Tailwind CSS as scripting language to create a universal style system for React Native.
• 📄 React-Navigation-V6 - Is a library to Routing and navigation for Expo and React Native apps.
• 📄 Expo-notifications - Is provides an API to fetch push notification tokens and to present, schedule, receive and respond to notifications.
• 📄 Typscript - TypeScript is JavaScript with syntax for types.

Server

• 📄 Fastify - Fast and low overhead web framework, for Node.js.
• 📄 Web-push - Web push requires that push messages triggered from a backend be done via the Web Push Protocol .
• 📄 Zod - TypeScript-first schema validation with static type inference.
• 📄 Typescript - TypeScript is JavaScript with syntax for types.

Web

• 📄 TailwindCss - A utility-first CSS framework packed with classes.
• 📄 Radix - Unstyled, accessible components for building high‑quality design systems and web apps in React.
• 📄 Axios - Axios is a promise-based HTTP Client for node.js.
• 📄 React-toastify - React-Toastify allows you to add notifications to your app with ease. No more nonsense.
• 📄 Phosphor-react - Phosphor is a flexible icon family for interfaces, diagrams, presentations — whatever, really.
• 📄 Dayjs -Fast 2kB alternative to Moment.js with the same modern API.
• 📄 clsx - The clsx function can take any number of arguments, each of which can be an Object, Array, Boolean, or String..

Made with 💜 by Rodrigo Figueiredo

👍 Thanks!