New Projects Weekly

Web Development Project Ideas

Looking for ideas for projects to practice web development skills? Try one (or all) of our real-world web development projects. This collection includes some of our best web development practice project ideas. They're all based on real world development scenarios, and include Figma files and style guides to help you get started.

Curricular React Projects Co-created with hiring managers and senior devs
Curricular JavaScript Projects Professionally designed, portfolio-ready project materials
Curricular Node Projects Highly vetted reviewers and mentors

Design a One-time Password Feature

</>
practice
intermediate

Put your full stack JavaScript skills to the test creating an application that handles OTP generation, validation, and user authentication.

FAQ Accordion

</>
practice
foundations

Practice essential frontend development skills by building this expandable and collapsable menu component.

Filterable and Sortable List Component

</>
practice
intermediate

Develop a filterable and sortable list view component for an issue tracking application, allowing users to filter tickets based on severity and status.

Toast Notifications

</>
practice
foundations

Master DOM manipulation, event handling, dynamic CSS styling and more by building a custom toast notification system using HTML, CSS, and JavaScript.

Testimonial Carousel

</>
practice
foundations

Sharpen your HTML, CSS, and JavaScript skills by practicing responsive design, dynamic content manipulation, and user interaction in implementing a testimonial carousel for a creator services app.

Pricing Page Design

</>
practice
foundations

Flex your proficiency with responsive design, CSS Flexbox/Grid, and JavaScript interactivity by creating a Pricing Page for a software-as-a-service application that looks good on desktop and mobile.

Task Card Component and Detail View

</>
practice
intermediate

Master foundational frontend development and responsive design skills by building a reusable Task Card and accompanying Task Detail View for a Project Management SaaS App.

Implement an RSVP Feature

</>
practice
foundations

Hone your responsive design and JavaScript or React skills by building an RSVP feature for a practical event management application.

Subtask Creation Workflow for SaaS App

</>
practice
intermediate

Implement an interface for users to add and assign subtasks within a Project Management SaaS application.

The essential toolkit for achieving coding mastery

Curricular Projects

Practice Like a Pro

Curricular Projects put you in a real-world professional situation to test how well you can actually apply your skills. Take on tickets, build to spec, and solve user problems.

Go beyond toy apps and clone sites, and level up your developer portfolio.

Curricular Projects

Prove You're Ready

Hiring managers want problem solvers. Our projects give you a tough assignment and trust you to solve it independenty, without hand-holding.

Prepare to sweat, hunt for answers when you get stuck, and reach new heights.

Curricular Projects

Grow with Expert Feedback

Upload your project solutions and receive personalized feedback from professional developers.

Validate your skills, celebrate your progress, and uncover specific areas to continue improving.

Curricular Projects

Learning Tailored to Your Goals

Accelerate your growth with a personalized learning path designed around your goals, your current skill level, and your learning style preferences.

We'll recommend a series of projects along with curated learning resources from around the web.

Start Building Today

More Web Development Project Ideas

Task Assignment Workflow

</>
practice
intermediate

Create a feature that allows users to assign tasks to teammates within a Project Management SaaS.

Interactive Job Post Creator

</>
capstone
advanced

Develop a job posting builder that streamlines the creation of job listings, incorporating user-friendly features and a mock API to simulate template saving and retrieval functionalities.

Create a Dynamic Account Application Form

</>
capstone
advanced

Put your front end development skills to the test building a high-converting, customer-friendly account application form for a financial services firm.

Profile Page for a SaaS App

</>
Practice
foundations

Create an elegant-looking, responsive profile page for a project management software, allowing users to view and update their personal and account information.

SaaS Notifications System

</>
Practice
intermediate

Create a notification system for a project management app that allows users to read, manage, and dismiss notifications they receive.

Responsive Navigation Menu

</>
Practice
beginner

Design and implement a navigation menu that works seamlessly across various screen sizes and devices.

Event Card Component

</>
Practice
beginner

Create a responsive, reusable card layout for an event planning website.

Landing Page for a SaaS App

</>
Practice
novice

Create an elegant-looking, responsive landing page for an applicant tracking system SaaS app.

Responsive Login Form with Validation

</>
Practice
beginner

Design and implement a responsive login component with fields for username and password, and basic form validation.

Create a Dynamic Account Application Form in React

</>
Capstone
Advanced

Use React to build a high-converting, customer-friendly account application form for a financial services firm.

Bring Your Own Python Project

</>
Capstone
Advanced

Get an in-depth code review and practice interview with a professional developer on a fullstack Python project of your choice.

Bring Your Own React Project

</>
Capstone
Advanced

Get an in-depth code review and practice interview with a professional developer on a React project of your choice.

Build a Support Dashboard for an AI Startup

</>
Capstone
Advanced

In this capstone project, use Python and Flask to make an enterprise support dashboard more readable and performant.

Start Building Today

Use Curricular for free as long as you like, or unlock full access with Curricular Pro.