harshcasper / allnotes Goto Github PK
View Code? Open in Web Editor NEWDemocratizing Notes and Resources sharing with MERN Stack Development
Home Page: all-notes-allnotes.vercel.app
License: MIT License
Democratizing Notes and Resources sharing with MERN Stack Development
Home Page: all-notes-allnotes.vercel.app
License: MIT License
Setup a Create React App Template. If this is the first time, you will be using React, let me share some information about it.
Create React App (CRA) is a toolkit that is generally used for setting up React Application with ease along with a lot of features, with a unified CLI. Feel free to read about it on the official Github Repository and on the Docs. This Article can give you more depth about what you will be dealing with.
You are supposed to fork the repository and create a branch where you will push your changes. Don't push the entire App on the Root. We will follow this directory structure:
- /client
-- /src
...
-- index.js
-- registerServiceWorker.js
- .gitignore
- package-lock.json
- package.json
- /server
- /models
-- item.js
- /node.modules
The Frontend Code will be in a client
directory while the Backend Code will be in the server
directory. Keep all the Frontend Code on the Client Directory which you will be supposed to create. Take a look at the Boilerplate Code and replace it with a simple Heading Tag which says: All Notes App
.
Finalize the Minimal Viable Product Features. We received a lot of feedback on the potential product features, but we need to shortlist a certain set of features, which would be our baseline for development and deployment. All the Product Perspectives would be available over the Notion Workspace, so if you want to work on this Issue, take a look at them and decide the MVP Features.
Document the set of features in a Markdown File and make a PR to the docs/
directory with the filename as the ROADMAP.md
. If you want further clarity on this Issue, feel free to drop me a message on Slack.
Create Contributors Guideline to help new Contributors get started with this Project.
CONTRIBUTING.md
to allow new users to get started with knowing how to contribute.You can use the content on the Notion Workspace as a reference for the Tutorial Links.
Setup the NodeJS and Express Template. There are a lot of NodeJS and Express Boilerplates available on Open-Source here and you can feel free to pick any one of them.
You can create your template, by following this article and have a simple API Route that returns a sample JSON Message.
You are supposed to fork the repository and create a branch where you will push your changes. Don't push the entire App on the Root. We will follow this directory structure:
- /client
-- /src
...
-- index.js
-- registerServiceWorker.js
- .gitignore
- package-lock.json
- package.json
- /server
- /models
-- item.js
- /node.modules
The Frontend Code will be in a client
directory while the Backend Code will be in the server
directory. Keep all the Backend Code on the Server Directory which you will be supposed to create. Take a look at the Boilerplate Code and replace it with a simple route that returns a JSON message.
Develop the Landing Page of the Application.
We don't have any wireframes as such for the purpose of the Landing Page. If you would like to come up with your design, please have a consultation with me on the basic features before you move ahead with the same. Since @pooja-gera has designed the previous pages as well, she might be better able to advise on how the landing page would look.
Make this PR on the main
branch. We need to deploy the same to denote the upcoming status of the application.
cc: @manikajain11 @m-code12 Let me know if you would like to work on the same. If yes, please self-assign this Issue using the Assignees
option on the Right.
Add a Github Action to auto-assign Mentors for every PR. It is a pain sometime to take a look at all the Projects for the PRs made by the Contributors. Getting a nice notification about reviewing a PR would make things easy for me.
You can take a look at this Github Action for the purpose. Check this out to know how to achieve the same.
Develop the 404 Page of the Application.
Make this PR on the dev
branch.
Add a Github Action to auto-assign Contributors. The Contributors can just type /assign
and the Issue would be assigned to them by a Github Bot.
Develop the User Profile Page of the Application.
We don't have any wireframes as such for the purpose of the Landing Page. If you would like to come up with your design, please have a consultation with me on the basic features before you move ahead with the same. Since @pooja-gera has designed the previous pages as well, she might be better able to advise on how the profile page would look.
Make this PR on the dev
branch. We need to deploy the same to denote the upcoming status of the application.
cc: @harsha14gupta @priyalweb Let me know if you would like to work on the same. If yes, please self-assign this Issue using the Assignees
option on the Right.
Design a Profile Page which consists of the User Details along with the Notes they have uploaded.
design/
directory with the Adobe XD/Figma Files and a JPEG/PNG of them as well. Have separate folders for each page.Integrate the Login and Signup APIs with the Login and Signup Screen.
The Signup Route should be refactored to this:
@route POST api/users
@desc Register user
@access Public
This must be a public route, implies no verification is required to access this route.
@route POST api/users/login
@desc Login user
@access Public
Rest all routes should be private and should not be visible unless the User is logged in.
Design a Splash Screen which can either an animation or a GIF which can serve as a loading screen to give the end-user immediate feedback that an application is starting and loading in the background.
design/
directory with the Adobe XD/Figma Files and a JPEG/PNG of them as well. Have separate folders for each page.Create a custom Issue and Pull Request Template.
Make an Issue Template. Any new Contributor must be able to specify if it is a new script or enhancement to an older one. It should also be specified which language he is coding it in.
Make a Pull Request Template. Any new Contributor must be able to specify if he has met all the requirements like Clean Code, proper README and Documentation, Screenshots (If any) attached and more.
You can take inspiration from here and check this out to know how to achieve the same.
Create a Code of Conduct which the Mentors and Participants must abide by.
Design a Dashboard Page where they can see all uploaded Notes. It can be as minimal as possible since we are yet to finalize the features.
design/
directory with the Adobe XD/Figma Files and a JPEG/PNG of them as well. Have separate folders for each page.Add DeepSource Static Code Analysis on this Repository.
deepsource.toml
on the Root.I will activate the analysis from my end to find Bugs and Anti-Patterns at every push.
Develop the Landing Page of the Application.
Make this PR on the dev
branch.
Create a route that shows that the Database Connection is successful and have a .env.example
file when you make a PR which has some necessary documentation on what the user needs to fill and set up a Database Connection.
cc: @aarushivij @Aaliya7516 Let me know if you would like to work on the same. If yes, please self-assign this Issue using the Assignees
option on the Right.
Create the Login/Signup Page Design in a widely-supported Design Software (Adobe XD/Figma).
design/
directory with the Adobe XD/Figma Files and a JPEG/PNG of them as well. Have separate folders for each page.Currently, we need a Logo for our Application which would be used on our Web Application Interface.
Logo Designs must be added in an appropriate form on the assets/Logo-Design/
Directory. The basic criteria we are looking for are:
Developing the User Schema of the Application and Login-Signup endpoints.
Make this PR on the dev
branch.
You may test the User Model against a local Database, since there would be another issue to setup a MongoDB Database using Atlas and setting a route to validate that.
cc: @saloniankita @Sonali12920 Let me know if you would like to work on the same. If yes, please self-assign this Issue using the Assignees
option on the Right.
Develop the Login/SignUp Pages for the Application.
Thanks to @pooja-gera for these awesome wireframe designs.
Please make the PR on the dev
branch instead of the Main Branch.
cc: @pccoder-2000 @pooja-gera Let me know if you would like to work on the same. If yes, please self-assign this Issue using the Assignees
option on the Right.
Add a 404 Page to keep a visitor on your site even if he/she hits a page that doesn't exist. This would also help us to change the Bad User experience to a positive one by adding some links to that 404 page so that the visitor can navigate to some other page.
design/
directory with the Adobe XD/Figma Files and a JPEG/PNG of them as well. Have separate folders for each page.A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.