70 Dni Kodowania: 70 Projektów w HTML, CSS i JavaScript

所在平台: Udemy

课程主页: https://www.udemy.com/course/70-dni-kodowania-70-projektow-w-html-css-i-javascript/

课程评论:没有评论

第一个写评论        关注课程

课程简介

## 70天前端开发实战:HTML、CSS与JavaScript项目集 **课程概述:** 踏上为期70天的为期70天的深度编码之旅,通过70个循序渐进的HTML、CSS和JavaScript项目,全面提升您的前端开发技能。本课程专为渴望通过实践和真实挑战来巩固网页开发知识的学习者设计。每天您都将构建一个新项目,深入理解并掌握网页创建的关键要素。 **课程亮点项目(部分):** * **引人入胜的首页设计:** 学习创建带有全屏视频背景的动态首页。 * **响应式导航菜单:** 构建能够适应各种屏幕尺寸的交互式导航。 * **灯箱图库:** 制作带有点击放大效果的图片展示库。 * **带选项卡的商品详情页:** 设计便于用户浏览不同产品部分的商品页面。 * **本地存储待办事项列表:** 开发能够将数据保存在浏览器中的任务管理应用。 * **表单数据验证:** 掌握如何对用户输入的表单数据进行有效性检查。 * **滚动时动态加载内容:** 实现页面滚动时自动加载更多内容的Infinity Scroll效果。 * **图片轮播/滑块:** 创建用于展示图片的交互式轮播组件。 * **模态登录/注册窗口:** 构建用于用户登录和注册的弹窗。 * **事件日历:** 学习创建用于管理事件的交互式日历。 * **图片悬停效果:** 实现各种图片悬停效果,增强页面互动性。 * **视差滚动效果:** 创造通过不同层级元素滚动速度差异带来的深度感。 * **手风琴式FAQ页面:** 构建包含可折叠组件的常见问题解答页面。 * **倒计时计时器:** 创建直到特定时间点的倒计时功能。 * **响应式价格表:** 设计适配所有设备的价格展示表格。 * **CSS过渡动画:** 学习使用CSS创建流畅的过渡与动画效果。 * **带筛选功能的商品搜索:** 实现允许按不同标准筛选商品的搜索功能。 * **简单JavaScript游戏:** 构建有助于理解JavaScript基础知识的小游戏。 * **CSS表单样式:** 学习美化表单,使其更具吸引力和可用性。 * **页面加载进度条:** 实现向用户展示页面加载进度的进度条。 * **页面滚动进度指示条:** 创建指示当前页面滚动深度的条形指示器。 * **基础代码编辑器:** 构建一个允许实时编写和预览代码的应用。 * **客户评价轮播:** 创建用于展示客户评价的轮播组件。 * **页面主题切换(明暗模式):** 实现网站在明暗模式之间切换的功能。 * **页面内容PDF生成:** 学习将网页内容导出为PDF文档。 * **拖放界面:** 构建允许用户通过拖放来操作元素的界面。 * **鼠标悬停图片缩放:** 实现鼠标悬停时图片放大的效果。 * **打字机文本效果:** 为页面文本创建文字逐字显示的效果。 * **多步表单:** 构建便于输入大量数据的分步式表单。 * **动画导航栏:** 实现响应用户交互的动画导航菜单。 * **页面雪花飘落效果:** 在页面上创造模拟雪花飘落的视觉效果。 * **简易Captcha验证:** 实现基本的Captcha验证,防止机器人提交。 * **数字时钟:** 创建显示当前时间的数字时钟。 * **计算器:** 构建执行基本数学运算的简易计算器。 * **翻转卡片效果:** 实现点击后内容翻转的卡片效果。 * **侧边抽屉菜单:** 创建点击后出现的侧边栏菜单。 * **Cookie同意提示:** 实现通知用户Cookie政策的提示框。 * **平滑滚动至页面段落:** 学习创建平滑滚动到页面特定部分的链接。 * **图片库(多种效果):** 构建带有不同视觉效果的精美图片库。 * **列表悬停效果:** 为列表项实现各种悬停交互。 * **Tooltip提示:** 创建鼠标悬停时显示额外信息的Tooltip。 * **石头剪刀布游戏:** 用JavaScript构建一个“石头、剪刀、布”游戏。 * **渐变背景:** 学习使用CSS创建渐变背景。 * **页面字体切换:** 实现允许用户切换页面字体的功能。 * **带勾选的购物清单:** 创建一个可标记完成项的购物列表。 * **页面内搜索:** 构建允许用户在页面 nội dung 中搜索的功能。 * **语言切换器:** 实现切换网站语言的功能。 * **文本折叠/展开效果:** 创建用于折叠和展开文本块的效果。 * **简易作品集页面:** 构建一个简洁优雅的个人作品集网站。 * **记忆游戏:** 创建一个锻炼用户记忆力的“配对”游戏。 * **列表筛选:** 学习根据不同标准筛选列表项。 * **密码生成器:** 构建一个生成安全密码的应用。 * **自定义鼠标指针:** 实现为页面设置不同鼠标指针样式。 * **事件时间轴:** 创建一个用于展示事件的交互式时间轴。 * **动态化元素样式:** 学习如何动态改变页面元素的CSS样式。 * **表格数据排序:** 实现对表格数据进行排序的功能。 * **井字棋游戏:** 创建一个简单的“井字棋”游戏。 * **实时字数统计:** 构建一个在用户输入时实时统计字数的工具。 * **复选框激活按钮:** 实现选中复选框后激活按钮的功能。 * **鼠标位置追踪:** 开发追踪鼠标在页面上位置的应用。 * **滑动侧边菜单:** 实现一个在视图中滑动的侧边菜单。 * **简易内容管理系统 (CMS):** 构建一个基本的CMS来管理页面内容。 * **带日历的预订应用:** 创建一个集成日历功能的预订应用。 * **HTML5 Canvas平台游戏:** 使用Canvas API实现一个简单的平台跳跃游戏。 * **Canvas物理模拟:** 利用Canvas创建物理现象的模拟。 * **排序算法实现:** 实现并理解各种排序算法的运作原理。 * **电商高级产品筛选:** 学习在电商网站中创建复杂的产品筛选器。 * **新用户引导:** 构建一个为新用户提供交互式指引的组件。 * **动态图表与统计:** 实现用于展示数据的动态图表和统计图形。 **课程定位:** 本课程非常适合希望获得现代、交互式网页开发实战经验的学习者。每个项目都经过精心设计,难度循序渐进,确保您在打下扎实的HTML、CSS和JavaScript基础的同时,能够逐步进阶到更高级的技能。加入我们,在70天内成为前端开发大师!

课程评论(0条)

课程详情

Przygotuj się na intensywne i satysfakcjonujące 70 dni pełne kodowania, podczas których wykonasz 70 różnorodnych projektów w HTML, CSS i JavaScript. Ten kurs został zaprojektowany z myślą o tych, którzy chcą rozwijać swoje umiejętności front-endowe poprzez praktyczne i realne wyzwania. Każdego dnia stworzysz nowy projekt, który pomoże Ci zrozumieć i opanować kluczowe aspekty tworzenia stron internetowych. Oto co czeka na Ciebie w trakcie kursu:Strona startowa z pełnoekranowym tłem wideo - Nauczysz się tworzyć atrakcyjne strony główne z dynamicznym tłem wideo.Responsywne menu nawigacyjne - Stworzysz nawigację, która dostosowuje się do różnych rozdzielczości ekranów.Galeria zdjęć z efektem lightbox - Zbudujesz galerię obrazów z efektem powiększenia po kliknięciu.Strona produktu z zakładkami - Zaprojektujesz stronę produktu z zakładkami, które umożliwiają łatwą nawigację po różnych sekcjach.Lista ToDo z lokalnym przechowywaniem - Stworzysz aplikację do zarządzania zadaniami, która przechowuje dane w przeglądarce.Formularz z walidacją danych - Nauczysz się walidować dane wprowadzane przez użytkowników w formularzach.Dynamiczne ładowanie treści przy scrollowaniu - Zaimplementujesz funkcję ładowania dodatkowych treści podczas przewijania strony.Slider obrazów - Stworzysz interaktywny slider do prezentacji obrazów.Modalne okno logowania/rejestracji - Zbudujesz modalne okno do logowania i rejestracji użytkowników.Kalendarz wydarzeń - Nauczysz się tworzyć interaktywny kalendarz do zarządzania wydarzeniami.Efekty hover dla obrazów - Zaimplementujesz różne efekty hover dla obrazów, aby zwiększyć interaktywność strony.Tło parallax - Stworzysz efekt parallax, który dodaje głębi stronie poprzez przesuwające się tło.Strona FAQ akordeon - Zbudujesz stronę FAQ z akordeonem, który ukrywa i pokazuje odpowiedzi na pytania.Timer odliczający - Stworzysz licznik czasu, który odlicza do określonego momentu.Responsywna tabela cen - Zaprojektujesz tabelę cen, która wygląda świetnie na wszystkich urządzeniach.Animacja przejść CSS - Nauczysz się tworzyć płynne animacje przejść za pomocą CSS.Wyszukiwarka produktów z filtrowaniem - Zaimplementujesz wyszukiwarkę, która pozwala na filtrowanie produktów według różnych kryteriów.Prosta gra w JavaScript - Stworzysz prostą grę, która pomoże Ci zrozumieć podstawy programowania w JavaScript.Stylizacja formularzy przy użyciu CSS - Nauczysz się stylizować formularze, aby były bardziej atrakcyjne i użyteczne.Pasek postępu przy ładowaniu strony - Zaimplementujesz pasek postępu, który informuje użytkowników o stanie ładowania strony.Poziomy pasek pokazujący stopień przewinięcia strony - Stworzysz pasek, który pokazuje, ile strony zostało przewinięte.Edytor kodu - Zbudujesz prosty edytor kodu, który pozwala na pisanie i podgląd kodu w czasie rzeczywistym.Pokaz slajdów z opiniami klientów - Stworzysz pokaz slajdów, który prezentuje opinie klientów.Zmiana motywu strony (jasny/ciemny) - Zaimplementujesz funkcję zmiany motywu strony między jasnym a ciemnym.Generowanie PDF z treści strony - Nauczysz się generować dokumenty PDF z treści strony internetowej.Drag & Drop interfejs - Stworzysz interfejs, który pozwala na przeciąganie i upuszczanie elementów.Przybliżanie obrazu przy najechaniu - Zaimplementujesz efekt przybliżania obrazów po najechaniu myszką.Efekt pisania maszynowego - Stworzysz efekt pisania maszynowego dla tekstu na stronie.Multi-step formularz - Zbudujesz formularz wieloetapowy, który ułatwia wprowadzanie dużej ilości danych.Animowany pasek nawigacyjny - Zaimplementujesz animowany pasek nawigacyjny, który reaguje na interakcje użytkownika.Efekt śniegu na stronie - Stworzysz efekt opadającego śniegu na stronie.Prosta walidacja captcha - Zaimplementujesz prostą walidację captcha, aby zabezpieczyć formularze przed botami.Zegar cyfrowy - Stworzysz zegar cyfrowy, który wyświetla aktualny czas.Kalkulator - Zbudujesz prosty kalkulator, który wykonuje podstawowe operacje matematyczne.Flip Card - Zaimplementujesz efekt flip dla kart, który zmienia ich treść po kliknięciu.Wysuwane menu boczne - Stworzysz wysuwane menu boczne, które pojawia się po kliknięciu.Alert o ciasteczkach - Zaimplementujesz alert informujący o polityce cookies na stronie.Płynne przewijanie do sekcji - Nauczysz się tworzyć płynne przewijanie do wybranych sekcji strony.Galeria obrazów - Zbudujesz atrakcyjną galerię obrazów z różnymi efektami.Działanie hover na liście - Zaimplementujesz różne efekty hover dla elementów listy.Podpowiedzi tooltip - Stworzysz podpowiedzi tooltip, które wyświetlają dodatkowe informacje po najechaniu.Prosta gra "Papier, kamień, nożyce" - Zbudujesz prostą grę "Papier, kamień, nożyce" w JavaScript.Tło gradientowe - Nauczysz się tworzyć tła gradientowe za pomocą CSS.Zmiana czcionki na stronie - Zaimplementujesz funkcję zmiany czcionki na stronie.Lista zakupów z możliwością zaznaczania - Stworzysz listę zakupów, na której można zaznaczać wykonane pozycje.Wyszukiwarka na stronie - Zbudujesz wyszukiwarkę, która umożliwia przeszukiwanie treści strony.Przełącznik języka - Zaimplementujesz funkcję zmiany języka strony.Efekt zwijania tekstu - Stworzysz efekt zwijania i rozwijania tekstu.Prosta strona portfolio - Zbudujesz prostą i elegancką stronę portfolio.Gra "memory" - Stworzysz grę "memory", która ćwiczy pamięć użytkownika.Filtrowanie listy - Nauczysz się filtrować listę elementów według różnych kryteriów.Generator haseł - Zbudujesz aplikację do generowania bezpiecznych haseł.Zmiana kursora - Zaimplementujesz różne style kursora na stronie.Timeline wydarzeń - Stworzysz interaktywną oś czasu do prezentacji wydarzeń.Zmiana stylów elementów - Nauczysz się dynamicznie zmieniać style elementów na stronie.Dynamiczne sortowanie tabeli - Zaimplementujesz funkcję sortowania danych w tabeli.Prosta gra w tic-tac-toe - Stworzysz prostą grę w kółko i krzyżyk.Licznik słów w czasie rzeczywistym - Zbudujesz licznik słów, który działa na bieżąco podczas pisania.Aktywacja przycisku po zaznaczeniu checkboxa - Zaimplementujesz funkcję aktywacji przycisku po zaznaczeniu pola wyboru.Śledzenie położenia kursora - Stworzysz aplikację śledzącą położenie kursora na stronie.Boczne menu z efektem przesuwania - Zaimplementujesz boczne menu, które przesuwa się w widoku.System zarządzania treścią (CMS) - Zbudujesz prosty CMS do zarządzania treściami na stronie.Aplikacja do rezerwacji z kalendarzem - Stworzysz aplikację do rezerwacji zintegrowaną z kalendarzem.Gra platformowa w HTML5 Canvas - Zaimplementujesz prostą grę platformową za pomocą Canvas.Symulacja fizyki z użyciem Canvas - Stworzysz symulację fizyki, wykorzystując możliwości Canvas.Implementacja algorytmów sortowania - Zaimplementujesz i zrozumiesz działanie różnych algorytmów sortowania.Zaawansowane filtrowanie produktów na stronie e-commerce - Nauczysz się tworzyć zaawansowane filtry produktów w sklepie internetowym.Przewodnik po stronie dla nowych użytkowników - Zbudujesz interaktywny przewodnik dla nowych użytkowników strony.Dynamiczne wykresy i statystyki - Zaimplementujesz dynamiczne wykresy i statystyki, które prezentują dane na stronie.Ten kurs jest idealny dla osób, które chcą zdobyć praktyczne doświadczenie w tworzeniu nowoczesnych i interaktywnych stron internetowych. Każdy projekt został zaprojektowany tak, aby stopniowo zwiększać poziom trudności i złożoności, zapewniając solidne podstawy w HTML, CSS i JavaScript oraz umożliwiając rozwój zaawansowanych umiejętności. Dołącz do nas i stań się mistrzem front-endu w zaledwie 70 dni!

课程标签

0人关注该课程

主题相关的课程