Full-Stack portfolio app utilizing the popular MERN stack (MongoDB, Express, React, Node), JWT Tokens, SendGrid API for sending contact form emails, and Google Cloud Storage for storing project screenshots. Users can register and then login to create, edit and delete projects. Learned about implementing a true state management solution with Redux Toolkit. Main pain point was contending with scope creep and asynchronous lifecycles in Redux. Deployed to AWS.
- Responsive mobile-first design
- CRUD functionality (portfolio projects)
- Register/Login users
- JWT Token authentication
- Contact form utilizes SendGrid API to send emails
- Project screenshots uploaded to Google Cloud Storage
- State management via Redux Toolkit
- Vite development tool
- Deployment via Docker Containers
- Rename backend/example.env to backend/.env and add in credentials for MongoDB, SendGrid API, Google Cloud Storage
- Generate your JWT secret eg.
node -e "console.log(require('crypto').randomBytes(256).toString('base64'));" - Run development server with
yarn run dev. Runs on default port 5000 unless otherwise specified in .env file.
Run Vite development server with yarn run dev. Runs on default port 5173.
This application can be deployed to production via docker compose
- Rename example.docker-compose.yml to docker-compose.yml and add in the environment variables from backend/.env.
- Deploy with
yarn run deploy.
