Use your knowledge of Bootstrap, documentation reading skills, and creative lens to create a website!

Adhoc

Use Python's Flask framework to create a pet adoption website.

Adopt a Pet

Add client-side routing to a pet adoption website using the concepts you learned in the React Router lesson.

Adopt a Pet!

Using a variety of JSX concepts, build an interactive interface that will display a selection of animal images and allow users to click an image for a fun fact.

Animal Fun Facts

In this project, we're going to practice animation in Sass so you can hone your skills and feel confident taking them to the real world.
Why? No modern website is complete without a little bit of animation.

Animated Company Logo

Use blueprints of famous monuments to estimate their area.

Architect Arithmetic

Use the power of arrays to store information about color and create an RGB color generator. 

Arrays: RGB Generator

In this project, we're going to practice git commits in Git so you can hone your skills and feel confident taking them to the real world.
Why? Making git commits is a safe way to save the current state of your work.

ASCII Portfolio

Use commands to redirect files in Athletica, a sporting events directory.

Athletica

In this project, we're going to practice configuration using the command line so you can hone your skills and feel confident taking them to the real world.
Why? Being able to configure your terminal will allow you to create shortcuts and configure things to your needs.

Attica

Practice creating React components by building a simple authorization layer for a contact page.

Authorization Form

In this project, you'll use associations to build a music catalog app.

Bass Music

In this project, we're going to practice merging to master in Git so you can hone your skills and feel confident taking them to the real world.
Why? Learning how to merge your branch to master will allow you safely include your code with the main codebase.

Birthday Party

Create a perceptual art in honor of the Black Lives Matter movement.

Black Lives Matter

Use everything you've learned about PHP strings, numbers, arrays, and variables to help a friend figure out his annual budget. 

Bob's Budget

In this project, you'll create two static pages using the Rails app's layout file and a view helper.

Bolt Network

In this project, you'll create a movie review board using a controller and a view.

Bolt Network 1

In this project, you'll add custom directives to your movie review board.

Bolt Network 2

In this project, you'll use associations to build a book review site.

Bookmarks

Let's create an animation overflowing with colorful bouncing balls! 

Bouncing Balls

In this project, we're going to practice element positioning in CSS so you can hone your skills and feel confident taking them to the real world.
Why? Applying the display and position properties on a certain element is something you'll be doing plenty of with CSS, so exploring and practicing it now will help you a lot.

Broadway

In this project, you'll create a Rails app for a static landing page.

Re-create an arcade classic: Space Invaders, in the form of Bug Invaders using Phaser.js!

Bug Invaders

Practice using bash scripts by creating a build script.

Build a Build Script

In this project, we're going to practice Classes in JavaScript so you can hone your skills and feel confident taking them to the real world.
Why? You'll practice utilizing the power of object-oriented programming and implement non repetitive code with concepts like inheritance.

Build a Library

This project is a step-by-step guide to create a restaurant menu database schema using PostgreSQL that closely models a real-life restaurant.

Build A Menu For Bytes Of China

Use real data from the Reddit API and display it using React and Redux.

​​Build Your Own Reddit App

Use C# arrays and loops to encrypt messages.


Caesar Cipher

Test and fix Cake Bar's new pick up feature

Cake O'Clock

In this project, we're going to practice routing in AngularJS so you can hone your skills and feel confident taking them to the real world.
Why? The ngRoute module allows us to navigate around our webpage without dealing with page reloading.

Calendar

External project focused on building the backend for a platform that will allow users to participate in photo caption contests.

Caption Contest

Apply your new middleware skills to help build the middleware pipeline for a coffee shop site in ASP.NET.

CC's Coffee Shop

Keep track of contacts and appointments with React.

Challenge Project: Appointment Planner

Build a style guide for your web projects, including custom fonts, colors, text styles, and more.

Challenge Project: Build a Website Design System

Collect all your HTML/CSS knowledge in one place by building a reference website.

Challenge Project: Build Your Own Cheat Sheet

In this project, you'll use flexbox to design the layout for a company of your choosing.

Challenge Project: Company Home Page with Flexbox

Build a flashcard app with React and Redux.

Challenge Project: Flashcards

Utilize your Responsive Design knowledge to create your ideal MeetUp group! Your page should look clean and crisp - regardless of the screen size!

Challenge Project: Responsive Club Website

Use logic and conditional statements to build a text-based Choose Your Own Adventure Game!

Choose Your Own Adventure

In this project, we’re going to practice building an interactive webpage in HTML, CSS, and JavaScript so you can hone your skills and feel confident taking them to the real world.   Why? These three languages are the backbone of all web development.

Chore Door

Build a secret message database using custom and built-in services to an ASP.NET app

Cipher Services

Create a bar chart using DOM elements and styling them based on the data bound to each.

Climate Change Burden of Disease Visualization

Update a blog to meet common CSS accessibility standards.

Code! Blog

Build a program that mimics Codecademy's online store.

Codecademy Store

This project will test your skills at preventing Cross-Site Request Forgery (CSRF) attacks in Node.js.

Codey's Confectionery: Preventing Cross-Site Request Forgery (CSRF) Attacks

Practice using prepared statements and form validation to prevent SQL injection attacks. 

Codey's Confectionery: Preventing SQL Injection Attacks

Create a game that includes scene transitions, animations, and tweens! 

Codey's Counting Conundrum

Put your knowledge of conditionals to use in developing a website.

Conditionals: The Great Outdoors

Create characters in the console using just your keyboard and new C# knowledge.

Console Creatures

In this project, we're going to practice the switch statement in Java so you can hone your skills and feel confident taking them to the real world. 7 continents, 7 cities, 1 expression. You got this!

Continents and Cities

We will build an app to demonstrate how to use a variety of advanced React techniques, including inline styles, separating container and presentational components, proptypes, and forms.

Copycat

We will test the CopyCat app by using the React Testing Library to mimic user interactions. Learners will have the opportunity to practice React Testing Library concepts such as querying for DOM nodes, jest-dom matchers and testing asynchronous interactions.

CopyCat Testing

Program an action-adventure fantasy story using Phaser.js.

Create a Fantasy Adventure Game

In this project, we're going to practice with the skill kit in Alexa Skill so you can hone your skills and feel confident taking them to the real world.
Why? Intents are the questions you want to ask Alexa. Let's edit some previous work to solidify your skills.

Create a New Intent 

Create a React application that allows users to search a music library, create a custom playlist, and save it to their account.

Create a Playlist App With the Spotify API (Part One)

Program a React app that lets users create custom Spotify playlists.

Create the technical design document for a feature request built on the Jammming project

Create a Playlist App With the Spotify API (Part Two)

Make a full-stack e-commerce app that lets users register accounts, browse products, and make purchases.

Create an E-Commerce App (Part One)

Create an E-Commerce App (Part Two)

Create an app of your own choosing that uses your knowledge of Node, Express, and all the other back-end technologies you've learned in the Back-End Engineer Career Path. 

Create Your Own Back-End Application

Create an app of your own choosing that uses your knowledge of React, Redux, and all the other front-end technologies you’ve learned in the Front-End Engineer Career Path.



Create Your Own Front-End App with React/Redux

In this project, we're going to practice Positioning in CSS so you can hone your skills and feel confident taking them to the real world.
Why? Proficiency in the positioning of elements on your web page, specifically overlapping, will prove very useful with building projects in CSS.

CSS Grid: Architecture Blog

In this project, we're going to practice organization in CSS so you can hone your skills and feel confident taking them to the real world.
Why? You'll need to get comfortable with defining columns and rows and controlling the elements within them in order to build beautiful websites.

CSS Grid: Task Board

In Codestrips, you'll build a back-end to support a small comic strip creation app. Using Express.js and Node-SQLite, create a new database, build the proper table, and create GET and POST routes to provide access to and the ability to create new comic strips.

Cumulative Project: Codestrips

Create various themes and reactive elements for a bird-watching website using CSS variables and functions.


Curious Ornithologist

Practice testing with Jest for Currency Comparison, an application that helps users compare their hourly salaries with other currencies.

Currency Comparison

Navigate through the files and directories of Daily Buzz, a national newspaper.

Daily Buzz

Add a Delete page to your Continent and Country app.

Data Delete

The template home page contains placeholder text. Replace this with continent and country lists. The student will study the code they already created in previous lessons and reuse that to complete the task.

Data Home

In this project, learners will normalize a database table containing data from a furniture store by creating a new set of tables that contain all of the same information. Learners will then have a chance to explore how data modifications and queries differ before and after normalization. 

Database Normalization at Fred's Furniture

Use collections, datasets, and dynamic pages to display and collect information on a blog.

Datasets: National Parks Adventures

Use your knowledge of Spring to build a RESTful web API for a restaurant dining review web app scenario.

Dining Review API

Utilize the Django framework to create an app that helps track a restaurant's inventory and sales. 

Django Delights

In this project, we're going to practice variables and strings in JavaScript so you can hone your skills and feel confident taking them to the real world.
Why? These concepts will help you use your data to output information to your users.

Dog Years

Use event listeners to add additional functionality and interactivity to a Wix site


Event Listeners and Selectors: See the Sale

Refactor a budgeting and expense tracking app to use the Redux Toolkit.

Expense Tracker

In this project, we're going to practice setup, exercise, and verify in Mocha so you can hone your skills and feel confident taking them to the real world.
Why? You'll learn three steps to guide you in writing perfect tests.

Factorial Feature

It's time to build fluency in HTML Fundamentals. In this next project, we're going to practice Structure in HTML so you can hone your skills and feel confident taking them to the real world.
Why? This project will help you to understand and master the building blocks of a webpage. It'll all build up from these foundations.  What's next? A blogger, a developer, a stylish website. You got this! 

Fashion Blog

In project, we're going to practice event handlers in jQuery so you can hone your skills and feel confident taking them to the real world.
Why? Event handlers help to provide a natural feedback for the user when they interact with your page.

Feedster

In this project, we're going to practice directives in AngularJS so you can hone your skills and feel confident taking them to the real world.
Why? Directives tell AngularJS's HTML compiler to attach a specified behavior to that DOM element, or even to transform the DOM element and its children.

Use your knowledge of full-stack web development to build your dream project using the PERN stack!

Final PERN App

Implement solutions for the FizzBuzz interview problem using different loop types in PHP.

FizzBuzz

In this project, you will create a small application in which users can add songs to their personal playlist from a global music library curated by an administrator.

FlaskFM

Set the Flexbox properties for a to-do app.

Flexbox: To-Do App

Build a Flower of Life geometrical figure in a 3D virtual environment using the `<a-circle>` primitive.

Flower of Life

Use your knowledge of HTML forms to collect input users and put a spin on a classic story! 

Form a Story

In this project, we will build a Fortune Telling Django web app using the MTV pattern. 


Fortune Teller

Add breadcrumbs to an online grocery store.

FreshDeals: Blueberries

Utilize all that you've learned towards building a fully-fledged Wix travel recommendations website.

Fullstack Dev: Travel Time

Use jQuery to toggle menus and submenus. 

Gameboard

In this project, you'll create a custom directive that displays the score of a game.

Let's build a tool that generates visualizations using keyboard interactions with p5.js.



Generative Art Creator

Practice using JavaScript iterator methods on arrays to hone your skills and feel confident taking them to the real world. 

Grammar Checker

Apply your new Page Model skills to help Grocer.ly build an online shopping site

Grocer.ly

Using CSS selectors, you’ll give a recipe website style.

Healthy Recipes

Use WebSockets to help create this fast-paced multiplayer game of hot potato!

Hot Potato

Apply your understanding of handling HTML forms in PHP to create a calculator.

HTML - PHP Calculator

In this project, you'll build a launch page that uses a model to save email addresses to a database.

Innovation Cloud

Create an inspirational homepage where you can check the weather, read an inspirational quote, view a pretty image, and write down your goals for the day.

Inspirational Homepage

Create a Nam June Paik-inspired interactive video sculpture using p5.js!

Projects in Web Development

All Projects in Web Development

Adhoc

Adopt a Pet

Adopt a Pet!

Animal Fun Facts

Animated Company Logo

Architect Arithmetic

Arrays: RGB Generator

ASCII Portfolio

Athletica

Resources

Support

Resources

Support

Plans

Community

Subjects

Languages

Career building

Mobile

Mobile