Welcome to notEdApp!
notEd is a solo project that I decided to create to help consolidate the learnings from working on my final team project at Makers Academy (EdUp).
I have attempted to recreate many features from this project and repurposed them to work for a notekeeping app instead, hence the name notEdApp (not-Ed-Up).
In this app, users will be able to create notes which can be viewed with the most recent ones showing first, notes will be able to be removed to prevent clogging the view, there will be a maximum limit of notes for each user, there will be a premium user feature (and a payment system to allow this) which allows the premium users to check their old notes, there will be a interactive calendar system that users can use to mark events.
Technologies used:
- Heroku for hosting app
- Mongoose to model objects in MongoDB
- Express web framework for Node.js
- React for frontend
- Node for backend
- MongoDB Atlas for hosting our database
- TailwindCSS for CSS
- StripeAPI for our Payment system
- Jest for testing
- React Testing Library for testing
- Github for hosting code, version control and GithubActions used for CI/CD
Visit https://noted-notedup.herokuapp.com/ or if you wish to run the app locally:
Make sure you have the most recent update of Node - you can use Node Version Manager. After installing NVM, you then run the following to install Node:
nvm install --lts
brew tap mongodb/brew
brew install [email protected]
brew services start [email protected]
git clone https://github.com/mcsuGH/notEdApp.git notEdApp
cd notEdApp
npm install
cd client
npm install
Open up a second terminal, then on one terminal, while in the main notEdApp directory run npm run start-dev
, on the other terminal, cd client
then run npm start
.
If you wish to get the website fully functional, with the test payment system, register at Stripe. Then while in the main directory create a file named .env
. Inside the .env
file, put in:
API_KEY="sk_test_51..."
where API_KEY is the API key from your account from Stripe.
Here is a video showcasing some of the features of the App:
- Users are able to register
- Users are not able to register if the username has already been used
- Passwords are encrypted
- Users can login and logout
- Successful logins redirect to Notes page
- Unsuccessful logins show an error message
- Successful registration redirects to Login page
- Unsuccessful registration shows an error message
- Navigation Bar shows different links depending if User is logged in or not
- Users not logged in who try to go on Notes/Calendar pages will be redirected to Login
- Users are able to create upto 10 Notes
- Attempting to create more than 10 will show a error
- Users are able to hide Notes
- Users are able to create Events on the Calendar (that only they can see)
- Users are able to click their Events on the Calendar to see the full title and description
- Users are able to delete their Events on the Calendar
- Users are able to filter the Events they see on the Calendar using the toggles
- Users are able to upgrade their user status to Premium by paying the test system £5.00
- Premium Users see a thank you message in place of the payment after successfully upgrading
- Premium Users are able to see their Notes that they have hidden on the Notes page
It is worth mentioning that I have attempted to keep requests to the server to a minimum - for example, when loading the Notes page, it will do one fetch initially, then any notes that get added/deleted are done so dynamically without the need of a new fetch request. The same applies to the Calendar - one fetch initially, then any changes are done so dynamically. For the User, the same still applies, there is one fetch initially when logging in, which is then stored locally and any changes such as upgrading to Premium is done without the need of fetching to the server again.