This is a full stack web application I worked during Fall'23 semester as part of Advanced Web Programming course at CalState LA.
- The app allows users to write code snippets that can be viewed and bookmarked by other users.
- Login/Register functionality is implemented for users to access personalized dashboard and feed.
- Users can select their topics (programming languages) for the personalized feed.
- Based on the user roles, users can/cannot perform some actions.
Backend: Node.js, Express.js, Mongoose, bcrypt
Frontend: Vue.js, axios, tailwindcss
Database: Mongo DB
Building a Node.js RESTful Server Application
- Implements a Express.js s
- Building a Node.js Server Application.
- Implement RESTful routes to manage resources.
- Development of the backend logic for handling HTTP requests and responses.
Adding JWT to the Node.js Server Application and Connecting to MongoDB
- Incorporate the MVC design pattern
- Implement schemas and data models
- Connect to MongoDB to store application data
Creating a Vue.js Frontend for the Node.js Server Application
- Enhance Snippet Application by using JWTs for user management
- Develop a dynamic and interactive user interface using Vue.js.
- Establish communication between the Vue.js frontend and the Node.js backend
Clone the repository
cd snippet-server
npm install # Installs the backend dependenciesTo run the application mongo atlas account is required
Go to config.json in snippet-server to replace the values of username and password with your mongo atlas credentials.
npm run start # Nodemon Automatically restarts based on file changesThe application is served at http://localhost:8080
cd snippet-client
npm install # Installs the frontend dependenciesnpm run devThe frontend is served at http://localhost:5173
- UI is pretty basic at best and needs to be revamped.
- An ML model/suggestion algorithm can be used to give more personalized feed.
- The feed doesn't show the bookmarks of the current snippet.
Shout out to Cydney Auman for teaching this class.