The system is based on the Pomodoro technique, which consists of activities performed at intervals of 25 minutes. For more information visit the link: 🌐https://pt.wikipedia.org/wiki/T%C3%A9cnica_pomodoro.
☑ Home;
☑ Timer;
☑ Experience Bar;
☑ Challenges;
☑ Failed Button - Cancels Challenge and Timer Reset;
☑ Complete Button - Adds Challenge Experience and Timer Reset;
☑ Displays a Modal when user level up;
☑ User data is saved in cookies;
✅ Routes for using MongoDB as an application database have been added;
✅ A Side Bar has been created;
✅ Navigation between Main page and Rankings;
✅ LogOut button;
✅ Login Page;
✅ Complete Layout;
✅ Login by Github with NextAuth;
✅ Login by Google with NextAuth;
✅ Login by Facebook with NextAuth;
✅ User registered in database (if it does not exist);
✅ Home:
✅ User data is updated;
✅ Rankings Page;
✅ Full Layout - Premium Version;
✅ Ranking with experience levels;
🔨-Deploy for production;
🔨-Responsive for mobile devices;
🔨-Addition of ranking with three levels (gold, silver and bronze);
🔨-Adding friendships button (add friends);
🔨-Added dark and light theme;
✒️To execute this project it is necessary to install some tools and libraries.
###📑 Requirements
[Git]🌐(https://git-scm.com);br> [Node.js]🌐(https://nodejs.org/en/);
[Yarn]🌐(https://classic.yarnpkg.com/en/docs/install);
Text Editor: [VSCode]🌐(https://code.visualstudio.com/).
⚙️Environment variables are inserted into a file at the root of the project, (src folder), with the name .env.
🔑GITHUB_CLIENT_SECRET="Provided in the auth app". 🔑GOOGLE_CLIENT_ID="Provided in the auth app";
🔑GOOGLE_CLIENT_SECRET="Provided in the auth app". 🔑FACEBOOK_CLIENT_ID="Provided in the auth app";
🔑FACEBOOK_CLIENT_SECRET"Provided in the auth app". 🌐NEXTAUTH_URL="Base URL of your site. Ex.: http://localhost:3000 ou https://moveit-premium.vercel.app/". 🔑AUTH_SECRET="...";
🔑JWT_SECRET="...". 🌐MONGODB_URI="...".
⚙️ To run this system you must perform the following steps:
in your text editor's terminal enter the following commands:
# Clone this repository
$ git clone https://github.com/MTheusRodrigues/Moveit-Premium.git
# Go to the project folder
$ cd moveit-premium
# Install dependencies
$ yarn install
# Install some necessary tools
$ yarn add mongodb;
$ yarn add @types/mongodb -D;
$ yarn add @vercel/node;
$ yarn add next-auth;
$ yarn add axios;
$ yarn add @fortawesome/free-solid-svg-icons;
$ yarn add @fortawesome/react-fontawesome;
$ yarn add add @fortawesome/fontawesome-svg-core;
$ yarn add typescript @types/react @types/react-dom @types/node -D;
$ yarn add js-cookie;
$ npm i react-router-dom;
# Run the application in development mode
$ yarn dev
# The application will open on the door:3000 - in your browser go to http://localhost:3000
Tools used for system construction:
Website (React + TypeScript)
- [Next.js]🌐(https://nextjs.org/)
- [Context]🌐(https://pt-br.reactjs.org/docs/context.html)
- [js-cookie]🌐(https://github.com/js-cookie/js-cookie)
- [css-Modules]🌐(https://github.com/css-modules/css-modules)
- [MongoDB]🌐(https://www.mongodb.com/)
- [Next-Auth]🌐(https://next-auth.js.org/)
- [React Icons]🌐(https://react-icons.github.io/react-icons/)
Go to the package.json file for more information [package.json]🌐(https://github.com/MTheusRodrigues/Moveit-Premium/blob/main/package.json)
Utilities
- Editor: [Visual Studio Code]🌐(https://code.visualstudio.com/)
- Fonts: [Rajdhani]🌐(https://fonts.google.com/specimen/Rajdhani), [Inter]🌐(https://fonts.google.com/specimen/Inter)
- FontWaesome 5.15.3 🌐(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css)
🌟 Matheus Rodrigues 🌟
Linkedin:👨💼(https://www.linkedin.com/in/matheus-rodrigues-570759184)
Email:📧(mailto:matheusrmo@outlook.com)
MIT.
Matheus Rodrigues 📧 Contact us!
🚀Rocketseat:https://rocketseat.com.br/;
👨💼Guilherme Rocha:https://github.com/grochavieira Linkedin:https://www.linkedin.com/in/grochavieira/;