A MERN stack app to keep track of online stuff, which you may want to view later. It also has a todo list feature, so you can add tasks to do later, and mark them as completed when done.

• Save the sort/filter/search state in url, so that when user refreshes the page, the state is not lost and the url can be shared with others.
• Added test cases for frontend and backend using react-testing-library and jest.
• Improve the UI of the app.
• Think of a better UX for the todo list feature.

Live Demo Deployed on Render

P.S: Its deployed on a free server which sleeps on inactivity, so first open might take some time.

• ReactJS - Frontend framework
• Context API using useContext & useReducer hooks - For state management
• Material-UI w/ lots of custom CSS - UI library
• React Router - For general routing & navigation

• Node.js - Runtime environment for JS
• Express.js - Node.js framework, makes process of building APIs easier & faster
• MongoDB - Database to store document-based data
• Mongoose - MongoDB object modeling for Node.js
• JSON Web Token - A standard to secure/authenticate HTTP requests
• Bcrypt.js - For hashing passwords
• Validator.js - For validation of JSON data
• Mongoose Unique Validator - Plugin for better error handling of unique fields within Mongoose schema
• Dotenv - To load environment variables from a .env file

• Authentication (login/register with email-password)
• Add/update/delete entries
• Add title, link, description, tags & type of link
• Bookmark important stuff (by 'starring' it)
• Mark the already read/watched items as 'viewed'
• Search entries by title, description, tags or status
• Filter entries by type (article, video or other), or by starred or viewed
• Click on tags to show all entries containing the tag you clicked on.
• Sort entries by oldest first, newest first, A-Z (alphabetical) or Z-A (reverse alpha.)
• Toast notifications for actions such as adding new entry, or 'starring' it etc.
• Dark mode toggle w/ local storage save
• Responsive UI for all screens

Create a .env file in server/ directory and add the following:

MONGODB_URI="Your Mongo Connection URI"
PORT=3005
SECRET="Your JWT secret"

Open client/src/backendUrl.js & change "backend" variable to "http://localhost:3005"

cd client
npm install
npm start

Type below commands in your terminal:

cd server
npm install
npm run dev