Web Portfolio Projects Ideas

Javascript UI Libraries Developer Tools Charting Libraries

Supabase Landing Page
1

Supabase

An open source Firebase alternative
Pricing:
- Open Source
This is a project where you take multiple inputs from the user and add them to a database of some sort. Daybook is a good example of what you're going to build. Now you can build this in many different ways. I'm going to outline the path I would personally take. As for the database, there are many options, personally, I'd go with Supabase but feel free to use whatever you are comfortable with.

#Developer Tools #Realtime Backend / API #Backend As A Service 428 social mentions
Scrimba Landing Page
2

Scrimba

Interactive coding screencasts created in an instant
Pricing:
- Open Source
If you're a beginner, I recommend you go through a course first. It helps to have some existing knowledge before attempting to create your projects. I personally used courses from Scrimba and SoloLearn to build my initial understanding.

#Online Learning #Education #Online Courses 143 social mentions
GSAP Landing Page
3

GSAP

GSAP (GreenSock Animation Platform) is a suite of JavaScript tools for high-performance animations that work in all major browsers.
Pricing:
- Open Source
- Freemium
- Free Trial
- $99.0 / Annually
Now that you've created some projects, you can create your own portfolio. You can showcase who you are, what you do, your experience, your skills and how people can reach you. Your portfolio website is a portrayal of who you are and it is likely the first thing people see so you should really go all out here. This is also where animations come in. Animations can help you stand out and also make your portfolio website look and feel amazing. If you are using vanilla JavaScript then you could look into GSAP, Animate-On-Scroll, AnimateCSS and AnimeJS. For React, I would highly recommend Framer-Motion but AnimateCSS works in React pretty good as well.

#Javascript UI Libraries #Charting Libraries #Animation 71 social mentions
Daybook Landing Page

4

Daybook

Daybook is an application that allows you to record activities, experiences, thoughts, and entire ideas throughout a day and protect all of your information with a strong password.

This is a project where you take multiple inputs from the user and add them to a database of some sort. Daybook is a good example of what you're going to build. Now you can build this in many different ways. I'm going to outline the path I would personally take. As for the database, there are many options, personally, I'd go with Supabase but feel free to use whatever you are comfortable with.

#Lifestyle #Note Taking #Todos 2 social mentions
Anime.js Landing Page
5

Anime.js

Lightweight JavaScript animation library
Pricing:
- Open Source
Now that you've created some projects, you can create your own portfolio. You can showcase who you are, what you do, your experience, your skills and how people can reach you. Your portfolio website is a portrayal of who you are and it is likely the first thing people see so you should really go all out here. This is also where animations come in. Animations can help you stand out and also make your portfolio website look and feel amazing. If you are using vanilla JavaScript then you could look into GSAP, Animate-On-Scroll, AnimateCSS and AnimeJS. For React, I would highly recommend Framer-Motion but AnimateCSS works in React pretty good as well.

#Javascript UI Libraries #Development #Charting Libraries 37 social mentions