Web Development Project Ideas

This is a “wiki post” that anyone can edit. It’s designed to be a list of projects that you can build and deploy to practice your coding skills. Feel free to add more to the list.

If you would like assistance with building any of these, ask in the chatroom and/or send @Josh a message.

Portfolio Website

If you aren’t sure where to start, try this: [Tutorial] Quickstart a React Site and Blog with GatsbyJS

Color Pickers

Create an app that lets you pick colors and get the hex and RGB colors.

Music Player

You could use APIs from sites like Pandora, Spotify, or YouTube to play music in the browser.

Video Player

You could have a form that searches YouTube and/or Vimeo and loads videos in a player on the site.

Markdown Editor

Create an editor where you write markdown and the markdown gets rendered to HTML.

JavaScript Piano Keyboard

Make a piano keyboard on the screen that plays music when you click or tap the keys.

Bonus, allow users to enter the notes with text notation (look up Lilypond for inspiration) and then playback their music.

Onine Alarm Clock

Make an online clock (digital and/or analog). Allow users to set a timer, and pop up a desktop notification when the timer goes off.

Photo Gallery

Create a paginated photo gallery.

Weather App

Create an app that allows you to look up the weather by city name and/or zip code.

Dashboard for Stocks or Cryptocurrencies

You could build a dashboard to follow data that interests you.

Comment Guestbook

Build an old-style “guestbook” page where people can leave comments. Save the data in a database (FaunaDB, Firebase, Dynamo, SQL, or whatever you want).

Random Quote Generator

Don’t use someone else’s API — build your own backend that serves the quotes. You can use static JSON files if needed.

Text Chat App

Store the messages in a database.

Video Chat App

Look up WebRTC.

Notetaking App

Create an app that allows users to take notes and save them in a database.

To-Do List App

It should allow users to save notes in a database.

Quiz App

Build a quiz app that lets users answer questions and get a score at the end.

Converters / Formatters

Build a webpage that does one or more of the following tasks:

  • prettifies JSON
  • prettifies HTML
  • prettifies CSS/SCSS
  • converts between formats like YAML, JSON, and TOML
  • converts between markdown and HTML
  • converts between image formats like SVG and PNG in the browser

Other Ideas

Here are similar lists around the web, like this, this, and this.

See also: Paul's List of Database Driven Project Ideas

1 Like

If anyone would like help building any of these or wants to work on one of them together, let me know. :slight_smile:

1 Like