Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA Amazon AWS CompTIA Security+ AWS Certified Developer - Associate
Graphic Design Photoshop Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Mindfulness Personal Development Meditation Personal Transformation Life Purpose Coaching Neuroscience
Web Development JavaScript React CSS Angular PHP WordPress Node.Js Python
Google Flutter Android Development iOS Development Swift React Native Dart Programming Language Mobile Development Kotlin SwiftUI
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Retargeting
SQL Microsoft Power BI Tableau Business Analysis Business Intelligence MySQL Data Analysis Data Modeling Big Data
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Online Business Business Plan Startup Freelancing Blogging Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
2020-11-30 17:23:02
30-Day Money-Back Guarantee

This course includes:

  • 18.5 hours on-demand video
  • 1 article
  • Full lifetime access
  • Access on mobile and TV
Development Web Development CSS

50 Projects In 50 Days - HTML, CSS & JavaScript

Sharpen your skills by building 50 quick, unique & fun mini projects
Bestseller
Rating: 4.8 out of 54.8 (1,762 ratings)
13,123 students
Created by Brad Traversy, Florin Pop
Last updated 12/2020
English
English [Auto]
30-Day Money-Back Guarantee

What you'll learn

  • Project based teaching to sharpen your HTML, CSS & JavaScript skills
  • Perfect for beginners looking for things to build unique projects in a short timeframe
  • Modern styling with flexbox, CSS animations, custom properties, etc
  • DOM manipulation, events, array methods, HTTP requests & more
Curated for the Udemy for Business collection

Course content

51 sections • 164 lectures • 18h 29m total length

  • Preview01:07
  • Preview04:18
  • Project Starter Boilerplate
    07:36
  • Course Projects Code & Demos
    00:05

  • Preview00:43
  • Initial Cards
    08:57
  • Expanding Effect
    06:51

  • Preview00:59
  • Creating The Steps
    13:01
  • Step Functionality
    11:11

  • Preview01:05
  • Content & Circle Styling
    12:19
  • Rotate & Slide Effect
    11:02

  • Project Intro
    00:43
  • Hidden Search Widget
    09:06

  • Project Intro
    00:54
  • Background Image & Loading Text
    04:31
  • Load Blur Effect
    07:41

  • Project Intro
    01:02
  • Scroll Animation
    13:11

  • Preview00:55
  • Split Landing Page HTML & CSS
    14:29
  • Adding The Hover Effect
    07:11

  • Project Intro
    00:42
  • Styling The Form
    08:36
  • Adding The Wave Effect
    09:37

  • Project Intro
    01:10
  • Sound Board Project
    09:52

Requirements

  • A very basic understanding of HTML, CSS & JavaScript

Description

This is a purely project-based course. It is geared toward beginners, but intermediate developers can also enjoy creating new things. This course includes 50 mini projects in HTML, CSS & JavaScript that relate to the DOM (Document Object Model). Here is a list of what we will create in this course:


  1. Expanding Cards

  2. Progress Steps

  3. Rotating Navigation Animation

  4. Hidden Search Widget

  5. Blurry Loading

  6. Scroll Animation

  7. Split Landing Page

  8. Form Wave

  9. Sound Board

  10. Dad Jokes

  11. Event Keycodes

  12. Faq Collapse

  13. Random Choice Picker

  14. Animated Navigation

  15. Incrementing Counter

  16. Drink Water

  17. Movie App

  18. Background Slider

  19. Theme Clock

  20. Button Ripple Effect

  21. Drag N Drop

  22. Drawing App

  23. Kinetic Loader

  24. Content Placeholder

  25. Sticky Navbar

  26. Double Vertical Slider

  27. Toast Notification

  28. Github Profiles

  29. Double Click Heart

  30. Auto Text Effect

  31. Password Generator

  32. Good Cheap Fast

  33. Notes App

  34. Animated Countdown

  35. Image Carousel

  36. Hoverboard

  37. Pokedex

  38. Mobile Tab Navigation

  39. Password Strength Background

  40. 3d Background Boxes

  41. Verify Account UI

  42. Live User Filter

  43. Feedback UI Design

  44. Custom Range Slider

  45. Netflix Mobile Navigation

  46. Quiz App

  47. Testimonial Box Switcher

  48. Random Image Feed

  49. Todo List

  50. Insect Catch Game

Who this course is for:

  • Beginner and intermediate web developers that want to build fun, unique projects with HTML, CSS & JavaScript

Featured review

Bob Ghodsi
Bob Ghodsi
60 courses
21 reviews
Rating: 5.0 out of 5a month ago
I have enjoyed taking this course because Brad puts focus on extensive use of new CSS as well as JavaScript. I am quite familiar with Bootstrap 4.0 as I have written many applications using bootstrap framework along with some CSS. I appreciate how new CSS makes it possible to exactly define what you would like your page to look like. At the same time I am learning new ways utilizing my understanding of JavaScript to complement my CSS knowledge.

Instructors

Brad Traversy
Full Stack Web Developer & Instructor at Traversy Media
Brad Traversy
  • 4.7 Instructor Rating
  • 98,441 Reviews
  • 253,437 Students
  • 14 Courses

Brad Traversy has been programming for around 12 years and teaching for almost 5 years. He is the owner of Traversy Media which is a successful web development YouTube channel and specializes in everything from HTML5 to front end frameworks like Angular as well as server side technologies like Node.js, PHP and Python. Brad has mastered explaining very complex topics in a simple manner that is very understandable. Invest in your knowledge by watching Brad's courses.

Florin Pop
Web developer, YouTuber and Streamer
Florin Pop
  • 4.8 Instructor Rating
  • 1,762 Reviews
  • 13,110 Students
  • 1 Course

I'm a Web Developer specialized in FrontEnd development. I also have a YouTube channel where I'm teaching programming and I stream often on Twitch different coding challenges. I love coding and I love helping others on their journey of becoming better developers. You can also often find me on Twitter sharing bits of my journey.

  • Udemy for Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Terms
  • Privacy policy
  • Cookie settings
  • Sitemap
  • Featured courses
Udemy
© 2021 Udemy, Inc.