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
Курс Учебный план
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
- Массивы
- 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.
- Объяснения курса, руководства для преподавателей и вопросы и ответы
- Слайды для занятий, интерактивные уроки и офлайн-мероприятия
- Exercises and Portfolio projects
- Вопросы для проверки знаний студентов
Отмеченная наградами программа по компьютерным наукам
2023
i-Learn
Первое место по выбору читателей Информатика
2024
Прорыв в сфере образовательных технологий
Поставщик года
2024
Лучшее из STEM
Учебная программа педагога Pick-AI для преподавания и обучения
2025
Влияние Edtech
Топ преподавания Инструмент эффективности
Часто задаваемые вопросы
CodeMonkey, ведущая игровая обучающая платформа, обучает студентов восьми лет и старше фундаментальным принципам компьютерного программирования. Продукты CodeMonkey, основанные в 2014 году, призваны максимально повысить вовлеченность и удобство работы пользователей, чтобы познакомить студентов с основами компьютерного программирования. Используя реальные языки программирования и масштабируемость для всех учебных сред, CodeMonkey предоставляет готовое решение для преподавателей, предлагая базовое обучение, инструменты управления и отчетности, автоматическое выставление оценок и подробные руководства для учителей и обратную связь в реальном времени для учащихся.
Опыт работы не требуется.
Опыт работы не требуется.
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 9-12 классы.