Portfolio Website with Django, Django REST Framework, Next.js, Framer Motion, and PostgreSQL

---

Used

• Django Python web framework
• Django REST Framework APIs
• PostgreSQL
• Next.js 14 Frontend
• Framer Motion

Installation

• Create a Virtual Environment:

cd backend

python -m venv venv

venv\Scripts\activate

• Install Required Backend Dependencie:

pip install -r requirements.txt

• Set Up Backend Environment Variables:

  Declare environment variables in the .env file (without quotation marks):

DEBUG=on
SECRET_KEY=
DATABASE_HOST=
DATABASE_PASS=
DATABASE_USER=
DATABASE_NAME=
DATABASE_PORT=
FRONTEND_URL=http://localhost:3000
SENDGRID_API_KEY=

• Frontend Setup (Next.js)

cd frontend
npm install

• Declare environment variables in the .env file

DATABASE_HOST='localhost'
BACKEND_URL='http://localhost:8000/api/'
BACK_BACKEND_URL_STATIC='http://localhost:8000/'
RESEND_API_KEY=

Demo

Frontend demo

Conclusion

By the end of this project, you’ll have a professional portfolio website that reflects your skills and creativity. Feel free to customize it further, experiment with animations, and make it uniquely yours! 🚀