Web Development
High School Students learn fundamentals of front-end web development
using HTML, CSS, and JavaScript.
Front-End Development with HTML, CSS & JavaScript
Browser-Based Code Editor – No Installation Needed
Designed for High School Students
Portfolio Website Project by Course End
100% Web-Based — No Installations Needed
Project-Based, Hands-On Learning
High School Web Development Course
This course introduces students to the fundamentals of front-end web development
using HTML, CSS, and JavaScript. Through engaging projects and real-world design
challenges, students will learn how to plan, design, and build fully functional websites.
The course emphasizes creative problem-solving and iterative development.
This course is hands-on and interactive. Students spend most of their time designing and
building web content while receiving just-in-time instruction and peer feedback.
Students get immediate feedback from embedded practice questions, work through hands-on projects, and collaborate with peers along the way. Students use CodeMonkey’s robust in-browser code editor to build and preview web pages. No setup or installation is required.
- Short, focused lessons to introduce new concepts
- Hands-on exercises to apply new skills right away
- Capstone projects that simulate real-world web design challenges
Course Syllabus
HTML Basics
- 2-3 weeks
This unit introduces students to the basics of HTML, the language used to structure content online.
Students will learn how to create meaningful page layouts using semantic tags and how to add text, images, links, tables, and forms.
By the end of the unit, students will be able to build a clean, well-structured resume webpage.
- Introduction to Web Design and Development
- HTML Basics
- Lists, Tables, Links
- Forms and Input Elements
- Adding Images
- Unit Project: Build a Resumé Page
Style with CSS
- 2-3 weeks
In this unit, students bring their HTML pages to life with visual design using CSS. Theylearn how to apply colors, spacing, typography, and layouts to create websites.
Through hands-on practice with the box model, grid system, and real-world layout patterns, students gain the skills to design multi-page websites that look polished.
- CSS Basics
- Color and Typography
- Text Styling
- Element Selectors, Class and ID Styling
- Layout Techniques
- Unit Project: Designing a Multipage Website
Programming with JavaScript
- 3-4 weeks
In this unit, students cover basic programming concepts using JavaScript, the language of the web. Through hands-on lessons, students learn how to work with variables,
conditionals, loops, functions, arrays, and simple DOM manipulation.
By building small programs and interactive challenges, students develop problem-solving skills and gain confidence writing their own code from scratch.
- Variables and Data Types
- User Input and Output
- Conditional Logic
- Iteration
- Arrays
- DOM Manipulation Basics
- Unit Project: Building an Interactive Quiz Game
Web Apps with JavaScript
- 3-4 lessons
In this unit, students bring their JavaScript skills to life by building a series of interactive, single-page web apps through guided code-along lessons.
Each project focuses on practical skills like working with arrays, handling user input, and manipulating the DOM.
By the end of the unit, students will have created a portfolio of fun, functional apps such as a quiz game, to-do list, and movie generator.
- Code Along: A Smart Tip Calculator
- Code Along: A Movie Recommendation Generator
- Code Along: Rock-Paper-Scissors
- Code Along: A Flashcard Quiz App
- Code Along: A To-Do List App
- Code Along: A Birthday Countdown App
- Project: An Interactive Single-Page Web App
- Quiz: Programming with JavaScript
Portfolio Project
- 2+ weeks
In this final unit, students put everything they’ve learned into action by building a complete multi-page website.
Students will apply design thinking, accessibility, and programming best practices while designing a website tailored to a specific audience or purpose.
Students will refine their work into a polished final project they can proudly share or present.
- Planning: Project Brainstorming and Idea Generation
- Best Practices: Design Principles and Accessibility
- Project Build: Final Portfolio Website (Multi-Page App)
- Portfolio Reflection and Submission
- Teacher guides and course explanations
- Exercises and portfolio projects
- Interactive lessons and Q&A’s
Web development is one of the most in-demand digital skills in today’s job market. Even if students don’t pursue a tech career, this course equips them with valuable skills.
- Understand how the web works and how websites are structured.
- Write semantic and accessible HTML.
- Style pages with CSS for both aesthetics and responsiveness.
- Use JavaScript to make websites interactive and respond to user input.
- Complete projects through iterative development.
- Create and present a personal website showcasing their skills.
Want to Learn More about our Web Development Course?
Give your students the tools to become creators, not just consumers of digital content.
- Course explanations, teacher guides and Q&As
- Classroom slides, Interactive lessons and offline activities
- Exercises and Portfolio projects
- Student review questions
Award-winning Computer Science Program
2023
i-Learn
First Place-Reader's Choice Computer Science
2024
Edtech Breakthrough
Provider of the Year
2024
Best of STEM
Educator's Pick-AI Curriculum for Teaching and Learning
2025
Edtech Impact
Top Teaching Efficiency Tool
FAQ
CodeMonkey, a leading game-based learning platform, teaches students eight years and older the fundamental principles of computer programming. Founded in 2014, CodeMonkey products are designed to maximize engagement and user experience to introduce students to foundational computer programming skills. Using real programming languages and scalability for all learning environments, CodeMonkey provides a turnkey solution for educators by offering basic training, management and reporting tools, automatic grading and detailed tutorials for teachers and real time feedback for students.
No experience is needed.
No experience is needed.
These courses are designed to be flexible! While they are perfect for teacher-led instruction, they can also be taken as self-guided courses. Students can move through the material at their own pace, making it ideal for independent learners.
CodeMonkey High School Computer Science courses are typically offered to 9th through 12th graders.
