web app ideas beginner projects

61 Web App Ideas for Beginner Projects

Ben by

If you’re starting to learn how to build web apps, then you’re probably thinking of something to build.

But then the programmers block sinks in.

If you’re stuck on what to build next, we’ve lined up 61 ideas for you to get your teeth into.

Beginner Projects

If you’re still getting to grips with your programming language

1 – Calculator App
Build a simple calculator app that can add, subtract, multiply and divide any given numbers. You can then expand on this project with more complex calculations like square root and storing calculations in memory.

2 – Image Hosting
Build a site that lets users upload images and share it’s URL. You can also offer embed codes and an upvote/downvote feature.

3 – Color Clock
Looking for a beginner JavaScript project? Why not build our colour clock?
A simple colour changing clock for those just beginning with JavaScript.

4 – Secure Password Generator
Build a site that generates random secure password based on a given password length. You can expand on this by giving options of whether to include numbers, symbols and other characters.

5 – Password Tester
Build a simple app that takes a users password and tells them how secure it is, based on the number of characters, entropy and dictionary words.

6 – MPG Travel Calculator
Build an app that works out how much fuel a car journey will use, and importantly how much it will cost. You could expand on this project by integrating with Google Maps

7 – Stopwatch/Countdown Timer
Use Javascript to make an on-page stopwatch

8 – Email Form
Build an online form that lets users send you an email through an online form.

9 – TXT Editor
Build a site that lets users upload TXT files, read and edit them, and then save and download them.

10 – EReader
Build a site that lets users upload PDF, Mobis

11 – Basic Login
Write a script that handles logins and passwords and create a protected area of your website.

12 – URL Shortener

13 – Book Manager
If you’re like me then you have hundred of books. Why not build an app that catalogs all your books in a database and lets you search them?

14 – Build a Chrome Extension
They’re super easy to build and can offer a lot of flexibility.

15 – Build a Firefox Extension
Just like Chrome extensions, they’re super easy to build and offer a lot of flexibility.

16 – Build a Twitter Bot
Twitter bots can be thoughtful or downright wacky, and everything inbetween! Why not start your own Twitter bot?

17 – Username Generator
Finding a qunique username is getting tougher and tougher, why not make a site that generates one for you?

18 – Domain Generator
Similar to above, make a site that generates unique domain names.

19 – TV, Movie or Anime Tracker
Store all the TV shows, Movies and Anime that you watch in a database. Search through them and rate each one.

20 – Brew Tracker
Keep all of the Beers, Wines or Spirits you’ve tried in a database. You can then search through them and give each one a rating.
You can also keep stock of how many you’ve got in your cupboards!

21 – Portfolio Site
While it might not be a web app, why not build yourself a portfolio website?
Have links to your CV, Github and social media accounts.

22 – Workout Tracker
Keep track of all your workouts, reps and sets in a database. Track your progress from session to session.
Bonus points for adding graphs and data visualization.

23 – Code Wars
Battle out against other coders online and improve your skills in the process.

24 – Paint
Get started with HTML5 and build a basic MS Paint clone.

25 – To Do List
Build a simple todo list application that keeps track of your day to day tasks.
You could try adding further features like email reminders and user accounts

Intermediate Projects

26 – Poll/Survey App
Build a simple site that lets users create their own polls/surveys, share them via a URL and let them view the results through an admin panel.
You can extend this further by creating embedable surveys for use on websites.

27 – Code Search
Build a site that stores code snippets and makes them searchable. Take a look at CoCycles for inspiration.

28 – Digg Clone
Let users embed a +1 button on their pages and articles. Display the most upvoted items on your homepage.

29 – Pastebin Clone
Build a simple web app that lets users upload code and share it through an unique URL.
You could add further features like restricting public/private visibility.

30 – Podcast Sharing
Similar to the image sharing site, why not build a web app that lets you easily share podcasts?
You can extend on this by offering podcast downloads, stream the podcast and by showing listener statistics.

31 – Local Coupons/Offers
Build a site that lets people and local business share offers that are going on at local shops.
You could take this to the next level by suggesting offers based on location data.

32 – Local Directory
Build an online directory of all the shops, restaurants, parks and places in your town or city. Let logged in users submit new places for approval.

33 – Wiki
Just like Wikipedia, a wiki lets users add new pages and link to existing pages using markup. To make a new page, you simple navigate to the new page’s URL.

34 – Blog
Of course no project list would be complete without the humble blog.
Build a simple blog application that lets you add blog posts and images.
You extend this further by adding media management, theme support and SEO features.

35 – RSS Reader
For a slightly more advanced project why not build an RSS reader?
You’ll need to build a web crawler to grab recent posts from a feed and add them to your database.
A great project if you want to start messing about with the command line interface.

36 – Recipe Site
Build a site that lets users login and share recipes.
Bonus points for adding a search feature and an up-vote system.

37 – Notes
Build an app that stores notes. Build user logins for multiple users!

38 – QR Code Scanner
Use a phone camera or webcam to scan and read QR codes.

39 – Spirit Level
Use phone sensors through the browser to tell when the phone is being held level.
Bonus points for a pretty HTML5 interface.

40 – Search Engine
Build a basic search engine that crawls a list of sites, indexes their contents and displays them through a search function.
Start messing around with your search algorithm for better results.

41 – Speed Test
Build an app that tests a users internet speed based on file download time and latency.

42 – Quiz/Trivia
Build an online Quiz or Trivia game. You could even add a highscore leaderboard.

43 – Photocropper
Build a site that lets user upload, crop/resize an image and download it.

44 – HTML Syntax Checker
Build an app that takes HTML input, checks it for errors and then returns a corrected HTML file.

45 – CSS Generator
Build a site that generates CSS styles for you!

46 – Chatroom
Use HTML5 to build an online chatroom for you and your friends

47 – Zen Sounds
The sounds of bubbling water and rainfall are so relaxing. Make an app that lets user play calming sounds and adjust the volume.

48 – Forum
Build your own forum software from scratch

49 – Q&A Site
Think Yahoo Answers and Stackoverflow. Let user ask questions and post solutions.

50 – Flask App
Get started with Flask, a Python framework for web apps.

51 – Markup Generator
Take raw text input and convert it into Markup!

API Projects

52 – News Alert
Use Google’s News API to make an app that lets you know when there’s new stories on a given subject.

53 – SMS Reminder
Using an API like Twilio or Nexmo build an app that lets you send SMS reminders to your phone.

54 – Product Search
Using Amazon, Ebay and Google’s Shopping API to search for products and find the cheapest retailer.

55 – Food Guru
Build a web app that takes data from Yelp and TripAdvisor to suggest restaurants that you might not know about

56 – Domain Generator
Build a site that uses an API to generate and check the availability of new domain names.

57 – Social Login System
Get stuck in with Google, Facebook and Twitter’s APIs.
Build a system that lets users login to your app using their Facebook, Twitter or Google accounts.

58 – TweetDeck Clone
Use Twitter’s API to build your own interface for posting tweets.

59 – File Locker
They might not be so popular now, but a file locker is fairly simple to build and will give you a lot of experience.

60 – Recipe Site
Take our previous recipes site and import recipes using an API.

61 – Petrol Prices
Pull petrol prices from an API and suggest that cheapest place nearby to fill up.

You may also like