Learn the art of how to build websites from scratch with our comprehensive web development course. Unlock your web design potential today! Read more.
I'm here to help you learn, achieve your dreams, come join me on this amazing adventure today. Providing Web development courses and digital marketing
Access all courses in our library for only $9/month with All Access Pass
Get Started with All Access PassBuy Only This CourseAbout This Course
Who this course is for:
- Web designers and web developers
- Entrepreneurs
- Anyone looking to practice building websites
- Anyone in need of a new website
- Anyone interested in site setup
- Anyone wondering how to get a website live
- Anyone thinking about what to consider when building a website
- Anyone who wants to practice building a website from scratch
- Anyone curious about how most websites are made
What you’ll learn:
- Learn how to practice building websites
- Understand what HTML, CSS, and JavaScript can do
- Be able to make web pages dynamic
- Gain insights into creating modern websites from scratch
- Create interactive web content
- Design and develop a website
Requirements:
- No prior knowledge is required for taking this course.
Do you want to become a professional web developer and are looking for a starting place? Then this course is for you!
Build your portfolio and become a professional web developer.
This is everything you need to know to jump into web development and build a successful foundation for creating your websites from scratch.
One of the best ways to learn is by seeing examples of code being implemented and used in REAL web projects. In this course, we not only cover the core foundation languages of front-end web development but also show you how to use them with plenty of examples. See how they work in different projects.
One of the biggest hurdles when getting involved with web development is finding a starting point. Explore how HTML, CSS, and JavaScript can work together to build dynamic and interactive modern websites that are ready for the real world. If you are unfamiliar with any of the languages used to create the websites within the course, we have you covered. Learn HTML, CSS, JavaScript, and jQuery; pick and choose what you want to learn; it’s all available for you anytime. If you need more help in one area than others, don’t worry – you will have access to multiple examples of the source code being put to use in a real project.
Everything you need in one place! One massive course! Watch it all or watch what you need to learn at the time.
Benefits of this course:
- Supercharge your portfolio: Build 10 different real-world websites from scratch. Having a portfolio to demonstrate websites you can build, as well as being able to use them as templates that can be easily customized to suit any web design need. Not every website is created the same way, so in the course, we provide you with 10 examples of modern websites: single-page websites, bootstrap websites, parallax websites, and more. These sites are unique and custom-built within the course.
- Prerequisites? Don’t worry; we have you covered and ready to learn the skills you need. We’ve included full sections explaining HTML, CSS, JavaScript, and jQuery that you can use as a reference for more information about coding used to build websites. No filler content, straight to the point, commonly used syntax for building modern websites.
- Useful bonus code snippets: The stuff you need to make your website come to life. Learn how to build a web contact form, fully functional and able to send emails from your website. Mouse events and more to make your website dynamic and interactive. Regular updates and more content updates.
- Resources you need: Learn how to think like a web developer and web designer. How to start creating websites, how to plan out your web design, and more. Explore top resources and links to use to improve what you can do when making websites. Source code from during the project and source code of the completed project is included. This means with this course, you get 10 custom templates to use within your projects.
- Professional web development: Have access to the resources you need. Create your portfolio as you learn web development. At the end of the course, you will be ready to make websites from scratch. Parachute in and get started in the business. Learn from an experienced web developer to see how it’s done. We show you the types of websites that you can build quickly and are in demand.
- No stone left unturned; this course is full of high-quality content ready for you to use as needed. Whatever your skill level, we guarantee that you will find value within this course. Have it all at the ready when you need it.
- Taught by a professional instructor with over 18 years of industry experience! Step-by-step training that you won’t find anywhere else. We guide you through learning how to create websites from scratch. By the end of the course, you will feel comfortable and be ready to start creating your websites. Jump in, and you will be amazed at what YOU can do. Making your dreams come to life online, with modern websites.
- I’m here to help you learn about web design and web development, and I’m ready to answer any questions you may have. When you are ready, join now and start creating your websites today.
Our Promise to You
By the end of this course, you will have learned how to build websites from scratch.
10 Day Money Back Guarantee. If you are unsatisfied for any reason, simply contact us and we’ll give you a full refund. No questions asked.
Get started today and learn more about how to build websites from scratch.
Course Curriculum
Section 1 - Learn How To Build Websites | |||
Introduction To Course | 00:00:00 | ||
How To Use This course | 00:00:00 | ||
Course Resources | 00:00:00 | ||
Course Resources Online | 00:00:00 | ||
Getting A Website | 00:00:00 | ||
What Is HTML CSS And JavaScript | 00:00:00 | ||
Resource List | 00:00:00 | ||
Section 2 - HTML Foundations For Building Websites | |||
Introduction To learning HTML | 00:00:00 | ||
Basics Of HTML | 00:00:00 | ||
How To Create A Basic HTML Template | 00:00:00 | ||
Basic HTML Template Source Code | 00:00:00 | ||
Headings Paragraphs And Line Breaks Content Structuring | 00:00:00 | ||
Adding Images Into HTML | 00:00:00 | ||
Ordered Lists Unordered Lists | 00:00:00 | ||
Hyperlinks Relative Paths Vs Absolute Paths | 00:00:00 | ||
Divs And Spans, Tel And Mailto | 00:00:00 | ||
HTML5 Semantic Elements | 00:00:00 | ||
Transfer Build Content To Editor | 00:00:00 | ||
Basic HTML Page Structure Sample | 00:00:00 | ||
How To Create HTML Forms | 00:00:00 | ||
HTML5 Input Types | 00:00:00 | ||
Additional Form Elements | 00:00:00 | ||
Form Resources | 00:00:00 | ||
HTML Conclusion | 00:00:00 | ||
Section 3 - CSS Foundations For Building Websites | |||
Introduction To CSS | 00:00:00 | ||
CSS Selecting Elements From HTML | 00:00:00 | ||
Working With CSS Colors | 00:00:00 | ||
CSS Background Options | 00:00:00 | ||
Adding Fonts | 00:00:00 | ||
Pseudo Classes And Design Patterns | 00:00:00 | ||
Using The Float Property | 00:00:00 | ||
Box Model Margins | 00:00:00 | ||
Box Model Padding Shorthand | 00:00:00 | ||
CSS To Create A Navbar | 00:00:00 | ||
Display Properties CSS | 00:00:00 | ||
CSS Overflow Handling | 00:00:00 | ||
CSS Positioning Elements | 00:00:00 | ||
CSS Tweaks And Updates | 00:00:00 | ||
Media Queries Making Your Website Responsive | 00:00:00 | ||
HTML CSS Summary | 00:00:00 | ||
Source Code HTML And CSS | 00:00:00 | ||
CSS Conclusion | 00:00:00 | ||
Section 4 - Quick JavaScript For Building Websites | |||
Introduction To JavaScript Overview | 00:00:00 | ||
What Is JavaScript | 00:00:00 | ||
How To Add JavaScript In Web Pages | 00:00:00 | ||
Basics Of JavaScript Dev Tools – How To Comment And More | 00:00:00 | ||
Introduction To Variables Within JavaScript | 00:00:00 | ||
Understanding Variables | 00:00:00 | ||
Variables Source Code | 00:00:00 | ||
Arrays And Objects | 00:00:00 | ||
Working With Arrays And Objects | 00:00:00 | ||
Using And Updating Array Values | 00:00:00 | ||
Array And Object Source Code | 00:00:00 | ||
Introduction To Functions | 00:00:00 | ||
Local Global Variables In Functions | 00:00:00 | ||
Source Code Functions | 00:00:00 | ||
Ternary Comparison | 00:00:00 | ||
Conditional Statements | 00:00:00 | ||
Switch Statements | 00:00:00 | ||
Source Code Statements Conditions | 00:00:00 | ||
Introduction To Looping | 00:00:00 | ||
JavaScript For Loops | 00:00:00 | ||
Source Code Loops | 00:00:00 | ||
Introduction To The Document Object Model | 00:00:00 | ||
Accessing Page Elements From JavaScript | 00:00:00 | ||
Selecting Elements Via JavaScript | 00:00:00 | ||
Source Code Selecting | 00:00:00 | ||
Updating CSS With JavaScript | 00:00:00 | ||
Source Code CSS | 00:00:00 | ||
JavaScript Events | 00:00:00 | ||
Event Listeners Selecting Elements | 00:00:00 | ||
Source Code Listeners | 00:00:00 | ||
addEventListener More Events Trigger Options | 00:00:00 | ||
Source Code addEventListener | 00:00:00 | ||
What Can You Do With JavaScript | 00:00:00 | ||
JavaScript Overview Conclusion | 00:00:00 | ||
Section 5 - Quick jQuery For Building Websites | |||
Introduction To Using jQuery | 00:00:00 | ||
What Is jQuery And Why Do We Use It | 00:00:00 | ||
Getting Started With jQuery | 00:00:00 | ||
jQuery Selectors | 00:00:00 | ||
Each Value From Multiple Selector Elements | 00:00:00 | ||
Updating Elements Via jQuery | 00:00:00 | ||
Source Code Selectors HTML | 00:00:00 | ||
CSS Selectors And jQuery Selectors | 00:00:00 | ||
Introduction To Event Binding | 00:00:00 | ||
Event Listeners jQuery Mouse Events | 00:00:00 | ||
Event Source Code | 00:00:00 | ||
Keyboard Event Triggers | 00:00:00 | ||
Source Code Keyboard Events | 00:00:00 | ||
Resize And Scroll Event Listeners On Window Object | 00:00:00 | ||
Source Code Windows Object | 00:00:00 | ||
Finding Input Values From Form jQuery | 00:00:00 | ||
jQuery Traversing Elements | 00:00:00 | ||
Select Elements From HTML Content | 00:00:00 | ||
Source Code Selection | 00:00:00 | ||
jQuery Working With CSS | 00:00:00 | ||
Source Code CSS | 00:00:00 | ||
Hide And Show Page Sections | 00:00:00 | ||
jQuery Effects Fading | 00:00:00 | ||
jQuery Effects Source Code | 00:00:00 | ||
jQuery Sliding Effects | 00:00:00 | ||
jQuery Animate | 00:00:00 | ||
Source Code | 00:00:00 | ||
jQuery AJAX Made Easy JSON And More | 00:00:00 | ||
Loading Data Into HTML Via jQuery | 00:00:00 | ||
jQuery AJAX Get getJSON | 00:00:00 | ||
AJAX With jQuery | 00:00:00 | ||
Source Code | 00:00:00 | ||
jQuery Conclusion | 00:00:00 | ||
Resources jQuery | 00:00:00 | ||
Using Map And Each Within jQuery | 00:00:00 | ||
Source Code Map And Each | 00:00:00 | ||
Section 6 - What Is Bootstrap | |||
Introduction To Using Bootstrap | 00:00:00 | ||
What Is Bootstrap And How Do You Use It | 00:00:00 | ||
Bootstrap Containers | 00:00:00 | ||
Basic Bootstrap Template | 00:00:00 | ||
Bootstrap Grid System | 00:00:00 | ||
Grid System Source code | 00:00:00 | ||
How To Practice And Learn The Bootstrap Grid | 00:00:00 | ||
Bootstrap Containers Jumbotron | 00:00:00 | ||
Bootstrap Typography | 00:00:00 | ||
Amazing Bootstrap Table Styling Options | 00:00:00 | ||
Bootstrap Table Source | 00:00:00 | ||
Bootstrap Form Inputs | 00:00:00 | ||
Button Options With Bootstrap | 00:00:00 | ||
Button Source Code | 00:00:00 | ||
Typography Options | 00:00:00 | ||
Bootstrap Images And Alignments | 00:00:00 | ||
Images Source Code | 00:00:00 | ||
Bootstrap Alerts | 00:00:00 | ||
Bootstrap Navbar | 00:00:00 | ||
Responsive Navbar Bootstrap | 00:00:00 | ||
NavBar Source Bootstrap | 00:00:00 | ||
Carousel Image Slider With Bootstrap | 00:00:00 | ||
Bootstrap Carousel Indicators | 00:00:00 | ||
Carousel Source Code | 00:00:00 | ||
Building A Modal Within Bootstrap | 00:00:00 | ||
Creating A Modal Complete | 00:00:00 | ||
Modal Source Code | 00:00:00 | ||
Bootstrap Utility Classes | 00:00:00 | ||
Source Code Bootstrap Utility Classes | 00:00:00 | ||
Bootstrap Conclusion Resources | 00:00:00 | ||
Bootstrap Resources | 00:00:00 | ||
Conclusion To Bootstrap Section | 00:00:00 | ||
Bootstrap 4 Beta Update | 00:00:00 | ||
Section 7 - Create A Quick Simple Website Using HTML And CSS | |||
Website 1 Introduction | 00:00:00 | ||
HTML And WireFrame | 00:00:00 | ||
Build HTML Structure | 00:00:00 | ||
HTML Structure Source Code | 00:00:00 | ||
Add Placeholder Content | 00:00:00 | ||
Add Styling To HTML Structure | 00:00:00 | ||
How To Turn Unorderd List Into A Navbar | 00:00:00 | ||
Source Code Navbar | 00:00:00 | ||
Media Screen Sizes: Make It Responsive | 00:00:00 | ||
Responsive Columns | 00:00:00 | ||
Clear Floating Move Around Sections | 00:00:00 | ||
Google Fonts And Customizing | 00:00:00 | ||
Source Code HTML | 00:00:00 | ||
Course Code CSS | 00:00:00 | ||
Website 1 Conclusion | 00:00:00 | ||
Section 8 - Build A Single Page Responsive Website | |||
Introduction Website 2 | 00:00:00 | ||
Create A Wireframe Of Website | 00:00:00 | ||
Build HTML Page Structure In Prep For Styling | 00:00:00 | ||
Build Navigation Menu And Page Content | 00:00:00 | ||
Build HTML Tags Nesting Of Semantic Elements | 00:00:00 | ||
Adding Styling To Your Webpage | 00:00:00 | ||
Linking To Libraries Google Fonts And More | 00:00:00 | ||
Sticky Headers Section Styling | 00:00:00 | ||
Build A Navigation Bar With CSS | 00:00:00 | ||
Add Background Images | 00:00:00 | ||
Section Text rgba | 00:00:00 | ||
CSS Media For Responsive Web Design | 00:00:00 | ||
Update Menu To Be Responsive On Resize | 00:00:00 | ||
Introduction To JavaScript And jQuery | 00:00:00 | ||
Add Click Events: Create Interactions For Users | 00:00:00 | ||
Use jQuery To Get Pixel Position Of HTML Elements | 00:00:00 | ||
Scroll Webpage Dynamically | 00:00:00 | ||
Hide Menu When Clicked On Small Screen | 00:00:00 | ||
Final Fix Of Issues Completed Website | 00:00:00 | ||
Source Code Single Page Website HTML | 00:00:00 | ||
Source Code Single Page Website CSS | 00:00:00 | ||
Conclusion website 2 | 00:00:00 | ||
Section 9 - Bootstrap Template From Scratch | |||
Website 3 Bootstrap Introduction | 00:00:00 | ||
Website Structure | 00:00:00 | ||
Add Styling To Sections | 00:00:00 | ||
Building A Navigation Menu | 00:00:00 | ||
Navbar With Bootstrap Easy | 00:00:00 | ||
Adding Buttons To Elements | 00:00:00 | ||
Rows And Columns Images Made Responsive | 00:00:00 | ||
Contact Form Using Bootstrap For Styling | 00:00:00 | ||
Add Background Images | 00:00:00 | ||
jQuery Scrolling Effect | 00:00:00 | ||
Adding Modals | 00:00:00 | ||
Summary | 00:00:00 | ||
Website 3 Conclusion | 00:00:00 | ||
Section 10 - Responsive Website Template | |||
Website 4 Introduction: Responsive Navbars | 00:00:00 | ||
Website Wireframe Plan | 00:00:00 | ||
Build HTML Structure Layout | 00:00:00 | ||
HTML Structure Source Code | 00:00:00 | ||
Floating Elements | 00:00:00 | ||
Update Header Elements | 00:00:00 | ||
Build Nav Menu CSS | 00:00:00 | ||
CSS Positioning And Nav Menu Source Code | 00:00:00 | ||
Margins Padding Logo Area Update | 00:00:00 | ||
Source Code | 00:00:00 | ||
Source Code CSS | 00:00:00 | ||
Update Styling Nav Menu Updates | 00:00:00 | ||
Main Wrapper Update Set Selected Item In Menu | 00:00:00 | ||
Use jQuery To Get URL Page Value | 00:00:00 | ||
jQuery Dynamic Classes | 00:00:00 | ||
Source Code | 00:00:00 | ||
Add Web Fonts Google Fonts To Website | 00:00:00 | ||
Select Page Styling | 00:00:00 | ||
Images Products Resize | 00:00:00 | ||
Section Summary | 00:00:00 | ||
Source Code HTML | 00:00:00 | ||
Source Code CSS | 00:00:00 | ||
Source Code JS | 00:00:00 | ||
Resources | 00:00:00 | ||
Website 4 Conclusion | 00:00:00 | ||
Section 11 - Two Column Responsive Website Template | |||
Website 5 Columns Introduction | 00:00:00 | ||
Website Planning Design Sketch | 00:00:00 | ||
Building HTML Structure | 00:00:00 | ||
HTML Adding Placeholder Content | 00:00:00 | ||
Source Code HTML | 00:00:00 | ||
Create Styling For Webpage | 00:00:00 | ||
CSS Course | 00:00:00 | ||
Header Positioning With CSS | 00:00:00 | ||
Create A Navigation Menu Bar | 00:00:00 | ||
Quick Fixes Image And Nav | 00:00:00 | ||
Making A 2 Column Website | 00:00:00 | ||
Quick Tweaks Of CSS | 00:00:00 | ||
3 Column Fat Footer Styling | 00:00:00 | ||
Source Code HTML And CSS | 00:00:00 | ||
Making Your Website Fully Responsive | 00:00:00 | ||
Updating Media Sizes | 00:00:00 | ||
Create Additional Web Pages | 00:00:00 | ||
HTML Index.html Page Source Code | 00:00:00 | ||
CSS style.css Source Code | 00:00:00 | ||
Website 5 Conclusion | 00:00:00 | ||
Section 12 - Simple Bootstrap 3 Menu Website | |||
Bootstrap 4 Changes From Bootstrap 3 | 00:00:00 | ||
Website 6 Introduction To Bootstrap Navbars | 00:00:00 | ||
Website Planning | 00:00:00 | ||
Building HTML Page Structure | 00:00:00 | ||
Adding Bootstrap To A Website | 00:00:00 | ||
Adding Placeholder Content | 00:00:00 | ||
Source Code HTML | 00:00:00 | ||
Adding Default Styling | 00:00:00 | ||
Update Logo Slogan Section | 00:00:00 | ||
Create A Navbar With Active Element | 00:00:00 | ||
Index Page Welcome Message | 00:00:00 | ||
Source Code | 00:00:00 | ||
Create A Two Column Content Area | 00:00:00 | ||
Create Footer Element | 00:00:00 | ||
Make It Responsive | 00:00:00 | ||
Setting Up Font Awesome | 00:00:00 | ||
Update Navbar To Be Responsive | 00:00:00 | ||
JavaScript To Hide And Show Elements | 00:00:00 | ||
Source Code First NavBar | 00:00:00 | ||
Create Another Responsive Navbar | 00:00:00 | ||
Source Code Second NavBar | 00:00:00 | ||
How To Add Bootstrap JavaScript Library | 00:00:00 | ||
Add Bootstrap Menu NavBar | 00:00:00 | ||
Bootstrap Menu Navbar | 00:00:00 | ||
Source Code Bootstrap | 00:00:00 | ||
Create Website Pages | 00:00:00 | ||
Online Code Editor | 00:00:00 | ||
Links And Resources | 00:00:00 | ||
Website 6 Conclusion | 00:00:00 | ||
Section 13 - Single Page Website With Parallax Website | |||
Website 7 Parallax Backgrounds Introduction | 00:00:00 | ||
Create Wireframe Of Website | 00:00:00 | ||
HTML Structure Create Nav Menu | 00:00:00 | ||
Creating HTML Sections | 00:00:00 | ||
Basic HTML Source Code | 00:00:00 | ||
Placeholder Content | 00:00:00 | ||
Apply CSS To HTML | 00:00:00 | ||
How To Create A Navbar From UL | 00:00:00 | ||
Full Page Size Sections And Background Defaults | 00:00:00 | ||
Add Background Images | 00:00:00 | ||
Make Your Text Standout | 00:00:00 | ||
Tweaking The Navbar For Responsive Effects | 00:00:00 | ||
Responsive Updates And Fixes | 00:00:00 | ||
Navbar For Small Screens | 00:00:00 | ||
Adding Footer And Updating Sections | 00:00:00 | ||
Source Code HTML And CSS | 00:00:00 | ||
Adding jQuery Create Event Triggers | 00:00:00 | ||
jQuery Binding Window Events | 00:00:00 | ||
Adding Icon Library | 00:00:00 | ||
Animate Scrolling With jQuery | 00:00:00 | ||
Slidemenu Up jQuery | 00:00:00 | ||
Add Parallax Effect | 00:00:00 | ||
Create A Contact Form | 00:00:00 | ||
Single Page Parallax Site Summary | 00:00:00 | ||
Source Code HTML jQuery | 00:00:00 | ||
Source Code CSS | 00:00:00 | ||
Resources | 00:00:00 | ||
Website 7 Conclusion | 00:00:00 | ||
Section 14 - Single Page Carousel Control Website | |||
Website 8 Introduction | 00:00:00 | ||
Website Plan Wireframe | 00:00:00 | ||
Web Design HTML Structure | 00:00:00 | ||
Adding Placeholder Design Content | 00:00:00 | ||
Setup Content Sections 100% | 00:00:00 | ||
Position Navbar | 00:00:00 | ||
Create Floating Navbar Indicators | 00:00:00 | ||
HTML And CSS Course Code | 00:00:00 | ||
Quick Introduction To jQuery | 00:00:00 | ||
jQuery To Select Elements With Hash | 00:00:00 | ||
Animate Scroll jQuery | 00:00:00 | ||
jQuery Scroll Window And Mapping Of Section Info | 00:00:00 | ||
Calculate Which Section: The Window Is Currently In | 00:00:00 | ||
Change Calls To Active On Scroll | 00:00:00 | ||
Source Code HTML jQuery | 00:00:00 | ||
Source Code CSS | 00:00:00 | ||
Website Tweak | 00:00:00 | ||
Making It Responsive | 00:00:00 | ||
Update Section Content | 00:00:00 | ||
Pseudo Elements Setup Sections | 00:00:00 | ||
Final Adjustments On Design | 00:00:00 | ||
Source Code Conclusion | 00:00:00 | ||
Source Code Project | 00:00:00 | ||
Website 8 Conclusion | 00:00:00 | ||
Section 15 - Multiple Page Website From Scratch With Active Class | |||
Website 9 Introduction: Multiple Page, Multiple Column | 00:00:00 | ||
Website Planning Wireframe Design | 00:00:00 | ||
Create Parent Elements HTML Structure | 00:00:00 | ||
Add Resources And Dummy Placeholder Content | 00:00:00 | ||
Apply Styling To HTML Top Level Elements | 00:00:00 | ||
Creating A Content Wrapper | 00:00:00 | ||
Navbar Setup And Styling | 00:00:00 | ||
Creating A Header | 00:00:00 | ||
Source Code HTML And CSS | 00:00:00 | ||
Setting Up Sections Sidebar And Footer | 00:00:00 | ||
CSS Tweaks And Fixes | 00:00:00 | ||
Add Media Queries Make It Responsive | 00:00:00 | ||
Add Additional Media Queries | 00:00:00 | ||
Source Code Media Queries | 00:00:00 | ||
Setup Responsive Navbar | 00:00:00 | ||
Setup Menu For Toggle Of Class | 00:00:00 | ||
Source Code HTML And CSS | 00:00:00 | ||
Add jQuery Event Trigger | 00:00:00 | ||
jQuery Source Code | 00:00:00 | ||
Setting Classes On The Fly | 00:00:00 | ||
Page Tweaks And Options | 00:00:00 | ||
Source Code With jQuery | 00:00:00 | ||
Create Additional Pages For Website | 00:00:00 | ||
Update Contact Form | 00:00:00 | ||
Source Code | 00:00:00 | ||
Website 9 Conclusion | 00:00:00 | ||
Section 16 - Single Page Bottom Menu Website | |||
Introduction Website 10 HTML CSS jQuery Together | 00:00:00 | ||
Wireframe Planning Of Website | 00:00:00 | ||
Web Design HTML Page Structure | 00:00:00 | ||
Add Placeholder Content To Prepare For Styling | 00:00:00 | ||
Setup CSS Defaults | 00:00:00 | ||
Create A Sticky Footer Position It At The Bottom | 00:00:00 | ||
Source Code | 00:00:00 | ||
Navbar Coding Options For Styling | 00:00:00 | ||
Navbar Options Code | 00:00:00 | ||
Add Styling To Sections | 00:00:00 | ||
Source Code Sections | 00:00:00 | ||
Add Section Background Covers | 00:00:00 | ||
Image Tweaks And Adjustments To CSS | 00:00:00 | ||
Header Update Style | 00:00:00 | ||
Contact Form Styling | 00:00:00 | ||
HTML CSS Source Code | 00:00:00 | ||
Add jQuery To Website | 00:00:00 | ||
Animate Scrolling Of Webpage | 00:00:00 | ||
Update Classes On Scroll | 00:00:00 | ||
Source Code With jQuery | 00:00:00 | ||
Google Fonts And Background Shadows | 00:00:00 | ||
How To Add Social Icons | 00:00:00 | ||
Resources To Update CSS And Customize | 00:00:00 | ||
Final Updates | 00:00:00 | ||
Source Code | 00:00:00 | ||
Website 10 Conclusion | 00:00:00 | ||
Section 17 - Making A Contact Form | |||
Introduction To Making A Contact Form | 00:00:00 | ||
Create HTML Bootstrap Structure | 00:00:00 | ||
Create Form Structure | 00:00:00 | ||
Add PHP Session Holder | 00:00:00 | ||
Source Code Contact Form | 00:00:00 | ||
PHP Get Post Data | 00:00:00 | ||
Anti Spam Check Using PHP | 00:00:00 | ||
PHP Send Email | 00:00:00 | ||
Upload File And Send Email To Email Address | 00:00:00 | ||
PHP Form Fixes | 00:00:00 | ||
PHP Form Mail Source Code | 00:00:00 | ||
jQuery Form Check Setup | 00:00:00 | ||
jQuery Toggle Error Messages | 00:00:00 | ||
Web Contact Form Live Test | 00:00:00 | ||
Web Contact Form Tweaks And Adjustments | 00:00:00 | ||
Complete Web Form Source Code | 00:00:00 | ||
Section 18 - Code Snippets In Action Just Useful Code For Web Development | |||
Code Snippets Introduction | 00:00:00 | ||
Popup Images Using JavaScript | 00:00:00 | ||
Source Code Popup Images | 00:00:00 | ||
Mouse Event Listeners JavaScript | 00:00:00 | ||
Source Code Mouse Event Listeners | 00:00:00 | ||
Section 19 - Conclusion | |||
Complete Websites Conclusion | 00:00:00 |
About This Course
Who this course is for:
- Web designers and web developers
- Entrepreneurs
- Anyone looking to practice building websites
- Anyone in need of a new website
- Anyone interested in site setup
- Anyone wondering how to get a website live
- Anyone thinking about what to consider when building a website
- Anyone who wants to practice building a website from scratch
- Anyone curious about how most websites are made
What you’ll learn:
- Learn how to practice building websites
- Understand what HTML, CSS, and JavaScript can do
- Be able to make web pages dynamic
- Gain insights into creating modern websites from scratch
- Create interactive web content
- Design and develop a website
Requirements:
- No prior knowledge is required for taking this course.
Do you want to become a professional web developer and are looking for a starting place? Then this course is for you!
Build your portfolio and become a professional web developer.
This is everything you need to know to jump into web development and build a successful foundation for creating your websites from scratch.
One of the best ways to learn is by seeing examples of code being implemented and used in REAL web projects. In this course, we not only cover the core foundation languages of front-end web development but also show you how to use them with plenty of examples. See how they work in different projects.
One of the biggest hurdles when getting involved with web development is finding a starting point. Explore how HTML, CSS, and JavaScript can work together to build dynamic and interactive modern websites that are ready for the real world. If you are unfamiliar with any of the languages used to create the websites within the course, we have you covered. Learn HTML, CSS, JavaScript, and jQuery; pick and choose what you want to learn; it’s all available for you anytime. If you need more help in one area than others, don’t worry – you will have access to multiple examples of the source code being put to use in a real project.
Everything you need in one place! One massive course! Watch it all or watch what you need to learn at the time.
Benefits of this course:
- Supercharge your portfolio: Build 10 different real-world websites from scratch. Having a portfolio to demonstrate websites you can build, as well as being able to use them as templates that can be easily customized to suit any web design need. Not every website is created the same way, so in the course, we provide you with 10 examples of modern websites: single-page websites, bootstrap websites, parallax websites, and more. These sites are unique and custom-built within the course.
- Prerequisites? Don’t worry; we have you covered and ready to learn the skills you need. We’ve included full sections explaining HTML, CSS, JavaScript, and jQuery that you can use as a reference for more information about coding used to build websites. No filler content, straight to the point, commonly used syntax for building modern websites.
- Useful bonus code snippets: The stuff you need to make your website come to life. Learn how to build a web contact form, fully functional and able to send emails from your website. Mouse events and more to make your website dynamic and interactive. Regular updates and more content updates.
- Resources you need: Learn how to think like a web developer and web designer. How to start creating websites, how to plan out your web design, and more. Explore top resources and links to use to improve what you can do when making websites. Source code from during the project and source code of the completed project is included. This means with this course, you get 10 custom templates to use within your projects.
- Professional web development: Have access to the resources you need. Create your portfolio as you learn web development. At the end of the course, you will be ready to make websites from scratch. Parachute in and get started in the business. Learn from an experienced web developer to see how it’s done. We show you the types of websites that you can build quickly and are in demand.
- No stone left unturned; this course is full of high-quality content ready for you to use as needed. Whatever your skill level, we guarantee that you will find value within this course. Have it all at the ready when you need it.
- Taught by a professional instructor with over 18 years of industry experience! Step-by-step training that you won’t find anywhere else. We guide you through learning how to create websites from scratch. By the end of the course, you will feel comfortable and be ready to start creating your websites. Jump in, and you will be amazed at what YOU can do. Making your dreams come to life online, with modern websites.
- I’m here to help you learn about web design and web development, and I’m ready to answer any questions you may have. When you are ready, join now and start creating your websites today.
Our Promise to You
By the end of this course, you will have learned how to build websites from scratch.
10 Day Money Back Guarantee. If you are unsatisfied for any reason, simply contact us and we’ll give you a full refund. No questions asked.
Get started today and learn more about how to build websites from scratch.
Course Curriculum
Section 1 - Learn How To Build Websites | |||
Introduction To Course | 00:00:00 | ||
How To Use This course | 00:00:00 | ||
Course Resources | 00:00:00 | ||
Course Resources Online | 00:00:00 | ||
Getting A Website | 00:00:00 | ||
What Is HTML CSS And JavaScript | 00:00:00 | ||
Resource List | 00:00:00 | ||
Section 2 - HTML Foundations For Building Websites | |||
Introduction To learning HTML | 00:00:00 | ||
Basics Of HTML | 00:00:00 | ||
How To Create A Basic HTML Template | 00:00:00 | ||
Basic HTML Template Source Code | 00:00:00 | ||
Headings Paragraphs And Line Breaks Content Structuring | 00:00:00 | ||
Adding Images Into HTML | 00:00:00 | ||
Ordered Lists Unordered Lists | 00:00:00 | ||
Hyperlinks Relative Paths Vs Absolute Paths | 00:00:00 | ||
Divs And Spans, Tel And Mailto | 00:00:00 | ||
HTML5 Semantic Elements | 00:00:00 | ||
Transfer Build Content To Editor | 00:00:00 | ||
Basic HTML Page Structure Sample | 00:00:00 | ||
How To Create HTML Forms | 00:00:00 | ||
HTML5 Input Types | 00:00:00 | ||
Additional Form Elements | 00:00:00 | ||
Form Resources | 00:00:00 | ||
HTML Conclusion | 00:00:00 | ||
Section 3 - CSS Foundations For Building Websites | |||
Introduction To CSS | 00:00:00 | ||
CSS Selecting Elements From HTML | 00:00:00 | ||
Working With CSS Colors | 00:00:00 | ||
CSS Background Options | 00:00:00 | ||
Adding Fonts | 00:00:00 | ||
Pseudo Classes And Design Patterns | 00:00:00 | ||
Using The Float Property | 00:00:00 | ||
Box Model Margins | 00:00:00 | ||
Box Model Padding Shorthand | 00:00:00 | ||
CSS To Create A Navbar | 00:00:00 | ||
Display Properties CSS | 00:00:00 | ||
CSS Overflow Handling | 00:00:00 | ||
CSS Positioning Elements | 00:00:00 | ||
CSS Tweaks And Updates | 00:00:00 | ||
Media Queries Making Your Website Responsive | 00:00:00 | ||
HTML CSS Summary | 00:00:00 | ||
Source Code HTML And CSS | 00:00:00 | ||
CSS Conclusion | 00:00:00 | ||
Section 4 - Quick JavaScript For Building Websites | |||
Introduction To JavaScript Overview | 00:00:00 | ||
What Is JavaScript | 00:00:00 | ||
How To Add JavaScript In Web Pages | 00:00:00 | ||
Basics Of JavaScript Dev Tools – How To Comment And More | 00:00:00 | ||
Introduction To Variables Within JavaScript | 00:00:00 | ||
Understanding Variables | 00:00:00 | ||
Variables Source Code | 00:00:00 | ||
Arrays And Objects | 00:00:00 | ||
Working With Arrays And Objects | 00:00:00 | ||
Using And Updating Array Values | 00:00:00 | ||
Array And Object Source Code | 00:00:00 | ||
Introduction To Functions | 00:00:00 | ||
Local Global Variables In Functions | 00:00:00 | ||
Source Code Functions | 00:00:00 | ||
Ternary Comparison | 00:00:00 | ||
Conditional Statements | 00:00:00 | ||
Switch Statements | 00:00:00 | ||
Source Code Statements Conditions | 00:00:00 | ||
Introduction To Looping | 00:00:00 | ||
JavaScript For Loops | 00:00:00 | ||
Source Code Loops | 00:00:00 | ||
Introduction To The Document Object Model | 00:00:00 | ||
Accessing Page Elements From JavaScript | 00:00:00 | ||
Selecting Elements Via JavaScript | 00:00:00 | ||
Source Code Selecting | 00:00:00 | ||
Updating CSS With JavaScript | 00:00:00 | ||
Source Code CSS | 00:00:00 | ||
JavaScript Events | 00:00:00 | ||
Event Listeners Selecting Elements | 00:00:00 | ||
Source Code Listeners | 00:00:00 | ||
addEventListener More Events Trigger Options | 00:00:00 | ||
Source Code addEventListener | 00:00:00 | ||
What Can You Do With JavaScript | 00:00:00 | ||
JavaScript Overview Conclusion | 00:00:00 | ||
Section 5 - Quick jQuery For Building Websites | |||
Introduction To Using jQuery | 00:00:00 | ||
What Is jQuery And Why Do We Use It | 00:00:00 | ||
Getting Started With jQuery | 00:00:00 | ||
jQuery Selectors | 00:00:00 | ||
Each Value From Multiple Selector Elements | 00:00:00 | ||
Updating Elements Via jQuery | 00:00:00 | ||
Source Code Selectors HTML | 00:00:00 | ||
CSS Selectors And jQuery Selectors | 00:00:00 | ||
Introduction To Event Binding | 00:00:00 | ||
Event Listeners jQuery Mouse Events | 00:00:00 | ||
Event Source Code | 00:00:00 | ||
Keyboard Event Triggers | 00:00:00 | ||
Source Code Keyboard Events | 00:00:00 | ||
Resize And Scroll Event Listeners On Window Object | 00:00:00 | ||
Source Code Windows Object | 00:00:00 | ||
Finding Input Values From Form jQuery | 00:00:00 | ||
jQuery Traversing Elements | 00:00:00 | ||
Select Elements From HTML Content | 00:00:00 | ||
Source Code Selection | 00:00:00 | ||
jQuery Working With CSS | 00:00:00 | ||
Source Code CSS | 00:00:00 | ||
Hide And Show Page Sections | 00:00:00 | ||
jQuery Effects Fading | 00:00:00 | ||
jQuery Effects Source Code | 00:00:00 | ||
jQuery Sliding Effects | 00:00:00 | ||
jQuery Animate | 00:00:00 | ||
Source Code | 00:00:00 | ||
jQuery AJAX Made Easy JSON And More | 00:00:00 | ||
Loading Data Into HTML Via jQuery | 00:00:00 | ||
jQuery AJAX Get getJSON | 00:00:00 | ||
AJAX With jQuery | 00:00:00 | ||
Source Code | 00:00:00 | ||
jQuery Conclusion | 00:00:00 | ||
Resources jQuery | 00:00:00 | ||
Using Map And Each Within jQuery | 00:00:00 | ||
Source Code Map And Each | 00:00:00 | ||
Section 6 - What Is Bootstrap | |||
Introduction To Using Bootstrap | 00:00:00 | ||
What Is Bootstrap And How Do You Use It | 00:00:00 | ||
Bootstrap Containers | 00:00:00 | ||
Basic Bootstrap Template | 00:00:00 | ||
Bootstrap Grid System | 00:00:00 | ||
Grid System Source code | 00:00:00 | ||
How To Practice And Learn The Bootstrap Grid | 00:00:00 | ||
Bootstrap Containers Jumbotron | 00:00:00 | ||
Bootstrap Typography | 00:00:00 | ||
Amazing Bootstrap Table Styling Options | 00:00:00 | ||
Bootstrap Table Source | 00:00:00 | ||
Bootstrap Form Inputs | 00:00:00 | ||
Button Options With Bootstrap | 00:00:00 | ||
Button Source Code | 00:00:00 | ||
Typography Options | 00:00:00 | ||
Bootstrap Images And Alignments | 00:00:00 | ||
Images Source Code | 00:00:00 | ||
Bootstrap Alerts | 00:00:00 | ||
Bootstrap Navbar | 00:00:00 | ||
Responsive Navbar Bootstrap | 00:00:00 | ||
NavBar Source Bootstrap | 00:00:00 | ||
Carousel Image Slider With Bootstrap | 00:00:00 | ||
Bootstrap Carousel Indicators | 00:00:00 | ||
Carousel Source Code | 00:00:00 | ||
Building A Modal Within Bootstrap | 00:00:00 | ||
Creating A Modal Complete | 00:00:00 | ||
Modal Source Code | 00:00:00 | ||
Bootstrap Utility Classes | 00:00:00 | ||
Source Code Bootstrap Utility Classes | 00:00:00 | ||
Bootstrap Conclusion Resources | 00:00:00 | ||
Bootstrap Resources | 00:00:00 | ||
Conclusion To Bootstrap Section | 00:00:00 | ||
Bootstrap 4 Beta Update | 00:00:00 | ||
Section 7 - Create A Quick Simple Website Using HTML And CSS | |||
Website 1 Introduction | 00:00:00 | ||
HTML And WireFrame | 00:00:00 | ||
Build HTML Structure | 00:00:00 | ||
HTML Structure Source Code | 00:00:00 | ||
Add Placeholder Content | 00:00:00 | ||
Add Styling To HTML Structure | 00:00:00 | ||
How To Turn Unorderd List Into A Navbar | 00:00:00 | ||
Source Code Navbar | 00:00:00 | ||
Media Screen Sizes: Make It Responsive | 00:00:00 | ||
Responsive Columns | 00:00:00 | ||
Clear Floating Move Around Sections | 00:00:00 | ||
Google Fonts And Customizing | 00:00:00 | ||
Source Code HTML | 00:00:00 | ||
Course Code CSS | 00:00:00 | ||
Website 1 Conclusion | 00:00:00 | ||
Section 8 - Build A Single Page Responsive Website | |||
Introduction Website 2 | 00:00:00 | ||
Create A Wireframe Of Website | 00:00:00 | ||
Build HTML Page Structure In Prep For Styling | 00:00:00 | ||
Build Navigation Menu And Page Content | 00:00:00 | ||
Build HTML Tags Nesting Of Semantic Elements | 00:00:00 | ||
Adding Styling To Your Webpage | 00:00:00 | ||
Linking To Libraries Google Fonts And More | 00:00:00 | ||
Sticky Headers Section Styling | 00:00:00 | ||
Build A Navigation Bar With CSS | 00:00:00 | ||
Add Background Images | 00:00:00 | ||
Section Text rgba | 00:00:00 | ||
CSS Media For Responsive Web Design | 00:00:00 | ||
Update Menu To Be Responsive On Resize | 00:00:00 | ||
Introduction To JavaScript And jQuery | 00:00:00 | ||
Add Click Events: Create Interactions For Users | 00:00:00 | ||
Use jQuery To Get Pixel Position Of HTML Elements | 00:00:00 | ||
Scroll Webpage Dynamically | 00:00:00 | ||
Hide Menu When Clicked On Small Screen | 00:00:00 | ||
Final Fix Of Issues Completed Website | 00:00:00 | ||
Source Code Single Page Website HTML | 00:00:00 | ||
Source Code Single Page Website CSS | 00:00:00 | ||
Conclusion website 2 | 00:00:00 | ||
Section 9 - Bootstrap Template From Scratch | |||
Website 3 Bootstrap Introduction | 00:00:00 | ||
Website Structure | 00:00:00 | ||
Add Styling To Sections | 00:00:00 | ||
Building A Navigation Menu | 00:00:00 | ||
Navbar With Bootstrap Easy | 00:00:00 | ||
Adding Buttons To Elements | 00:00:00 | ||
Rows And Columns Images Made Responsive | 00:00:00 | ||
Contact Form Using Bootstrap For Styling | 00:00:00 | ||
Add Background Images | 00:00:00 | ||
jQuery Scrolling Effect | 00:00:00 | ||
Adding Modals | 00:00:00 | ||
Summary | 00:00:00 | ||
Website 3 Conclusion | 00:00:00 | ||
Section 10 - Responsive Website Template | |||
Website 4 Introduction: Responsive Navbars | 00:00:00 | ||
Website Wireframe Plan | 00:00:00 | ||
Build HTML Structure Layout | 00:00:00 | ||
HTML Structure Source Code | 00:00:00 | ||
Floating Elements | 00:00:00 | ||
Update Header Elements | 00:00:00 | ||
Build Nav Menu CSS | 00:00:00 | ||
CSS Positioning And Nav Menu Source Code | 00:00:00 | ||
Margins Padding Logo Area Update | 00:00:00 | ||
Source Code | 00:00:00 | ||
Source Code CSS | 00:00:00 | ||
Update Styling Nav Menu Updates | 00:00:00 | ||
Main Wrapper Update Set Selected Item In Menu | 00:00:00 | ||
Use jQuery To Get URL Page Value | 00:00:00 | ||
jQuery Dynamic Classes | 00:00:00 | ||
Source Code | 00:00:00 | ||
Add Web Fonts Google Fonts To Website | 00:00:00 | ||
Select Page Styling | 00:00:00 | ||
Images Products Resize | 00:00:00 | ||
Section Summary | 00:00:00 | ||
Source Code HTML | 00:00:00 | ||
Source Code CSS | 00:00:00 | ||
Source Code JS | 00:00:00 | ||
Resources | 00:00:00 | ||
Website 4 Conclusion | 00:00:00 | ||
Section 11 - Two Column Responsive Website Template | |||
Website 5 Columns Introduction | 00:00:00 | ||
Website Planning Design Sketch | 00:00:00 | ||
Building HTML Structure | 00:00:00 | ||
HTML Adding Placeholder Content | 00:00:00 | ||
Source Code HTML | 00:00:00 | ||
Create Styling For Webpage | 00:00:00 | ||
CSS Course | 00:00:00 | ||
Header Positioning With CSS | 00:00:00 | ||
Create A Navigation Menu Bar | 00:00:00 | ||
Quick Fixes Image And Nav | 00:00:00 | ||
Making A 2 Column Website | 00:00:00 | ||
Quick Tweaks Of CSS | 00:00:00 | ||
3 Column Fat Footer Styling | 00:00:00 | ||
Source Code HTML And CSS | 00:00:00 | ||
Making Your Website Fully Responsive | 00:00:00 | ||
Updating Media Sizes | 00:00:00 | ||
Create Additional Web Pages | 00:00:00 | ||
HTML Index.html Page Source Code | 00:00:00 | ||
CSS style.css Source Code | 00:00:00 | ||
Website 5 Conclusion | 00:00:00 | ||
Section 12 - Simple Bootstrap 3 Menu Website | |||
Bootstrap 4 Changes From Bootstrap 3 | 00:00:00 | ||
Website 6 Introduction To Bootstrap Navbars | 00:00:00 | ||
Website Planning | 00:00:00 | ||
Building HTML Page Structure | 00:00:00 | ||
Adding Bootstrap To A Website | 00:00:00 | ||
Adding Placeholder Content | 00:00:00 | ||
Source Code HTML | 00:00:00 | ||
Adding Default Styling | 00:00:00 | ||
Update Logo Slogan Section | 00:00:00 | ||
Create A Navbar With Active Element | 00:00:00 | ||
Index Page Welcome Message | 00:00:00 | ||
Source Code | 00:00:00 | ||
Create A Two Column Content Area | 00:00:00 | ||
Create Footer Element | 00:00:00 | ||
Make It Responsive | 00:00:00 | ||
Setting Up Font Awesome | 00:00:00 | ||
Update Navbar To Be Responsive | 00:00:00 | ||
JavaScript To Hide And Show Elements | 00:00:00 | ||
Source Code First NavBar | 00:00:00 | ||
Create Another Responsive Navbar | 00:00:00 | ||
Source Code Second NavBar | 00:00:00 | ||
How To Add Bootstrap JavaScript Library | 00:00:00 | ||
Add Bootstrap Menu NavBar | 00:00:00 | ||
Bootstrap Menu Navbar | 00:00:00 | ||
Source Code Bootstrap | 00:00:00 | ||
Create Website Pages | 00:00:00 | ||
Online Code Editor | 00:00:00 | ||
Links And Resources | 00:00:00 | ||
Website 6 Conclusion | 00:00:00 | ||
Section 13 - Single Page Website With Parallax Website | |||
Website 7 Parallax Backgrounds Introduction | 00:00:00 | ||
Create Wireframe Of Website | 00:00:00 | ||
HTML Structure Create Nav Menu | 00:00:00 | ||
Creating HTML Sections | 00:00:00 | ||
Basic HTML Source Code | 00:00:00 | ||
Placeholder Content | 00:00:00 | ||
Apply CSS To HTML | 00:00:00 | ||
How To Create A Navbar From UL | 00:00:00 | ||
Full Page Size Sections And Background Defaults | 00:00:00 | ||
Add Background Images | 00:00:00 | ||
Make Your Text Standout | 00:00:00 | ||
Tweaking The Navbar For Responsive Effects | 00:00:00 | ||
Responsive Updates And Fixes | 00:00:00 | ||
Navbar For Small Screens | 00:00:00 | ||
Adding Footer And Updating Sections | 00:00:00 | ||
Source Code HTML And CSS | 00:00:00 | ||
Adding jQuery Create Event Triggers | 00:00:00 | ||
jQuery Binding Window Events | 00:00:00 | ||
Adding Icon Library | 00:00:00 | ||
Animate Scrolling With jQuery | 00:00:00 | ||
Slidemenu Up jQuery | 00:00:00 | ||
Add Parallax Effect | 00:00:00 | ||
Create A Contact Form | 00:00:00 | ||
Single Page Parallax Site Summary | 00:00:00 | ||
Source Code HTML jQuery | 00:00:00 | ||
Source Code CSS | 00:00:00 | ||
Resources | 00:00:00 | ||
Website 7 Conclusion | 00:00:00 | ||
Section 14 - Single Page Carousel Control Website | |||
Website 8 Introduction | 00:00:00 | ||
Website Plan Wireframe | 00:00:00 | ||
Web Design HTML Structure | 00:00:00 | ||
Adding Placeholder Design Content | 00:00:00 | ||
Setup Content Sections 100% | 00:00:00 | ||
Position Navbar | 00:00:00 | ||
Create Floating Navbar Indicators | 00:00:00 | ||
HTML And CSS Course Code | 00:00:00 | ||
Quick Introduction To jQuery | 00:00:00 | ||
jQuery To Select Elements With Hash | 00:00:00 | ||
Animate Scroll jQuery | 00:00:00 | ||
jQuery Scroll Window And Mapping Of Section Info | 00:00:00 | ||
Calculate Which Section: The Window Is Currently In | 00:00:00 | ||
Change Calls To Active On Scroll | 00:00:00 | ||
Source Code HTML jQuery | 00:00:00 | ||
Source Code CSS | 00:00:00 | ||
Website Tweak | 00:00:00 | ||
Making It Responsive | 00:00:00 | ||
Update Section Content | 00:00:00 | ||
Pseudo Elements Setup Sections | 00:00:00 | ||
Final Adjustments On Design | 00:00:00 | ||
Source Code Conclusion | 00:00:00 | ||
Source Code Project | 00:00:00 | ||
Website 8 Conclusion | 00:00:00 | ||
Section 15 - Multiple Page Website From Scratch With Active Class | |||
Website 9 Introduction: Multiple Page, Multiple Column | 00:00:00 | ||
Website Planning Wireframe Design | 00:00:00 | ||
Create Parent Elements HTML Structure | 00:00:00 | ||
Add Resources And Dummy Placeholder Content | 00:00:00 | ||
Apply Styling To HTML Top Level Elements | 00:00:00 | ||
Creating A Content Wrapper | 00:00:00 | ||
Navbar Setup And Styling | 00:00:00 | ||
Creating A Header | 00:00:00 | ||
Source Code HTML And CSS | 00:00:00 | ||
Setting Up Sections Sidebar And Footer | 00:00:00 | ||
CSS Tweaks And Fixes | 00:00:00 | ||
Add Media Queries Make It Responsive | 00:00:00 | ||
Add Additional Media Queries | 00:00:00 | ||
Source Code Media Queries | 00:00:00 | ||
Setup Responsive Navbar | 00:00:00 | ||
Setup Menu For Toggle Of Class | 00:00:00 | ||
Source Code HTML And CSS | 00:00:00 | ||
Add jQuery Event Trigger | 00:00:00 | ||
jQuery Source Code | 00:00:00 | ||
Setting Classes On The Fly | 00:00:00 | ||
Page Tweaks And Options | 00:00:00 | ||
Source Code With jQuery | 00:00:00 | ||
Create Additional Pages For Website | 00:00:00 | ||
Update Contact Form | 00:00:00 | ||
Source Code | 00:00:00 | ||
Website 9 Conclusion | 00:00:00 | ||
Section 16 - Single Page Bottom Menu Website | |||
Introduction Website 10 HTML CSS jQuery Together | 00:00:00 | ||
Wireframe Planning Of Website | 00:00:00 | ||
Web Design HTML Page Structure | 00:00:00 | ||
Add Placeholder Content To Prepare For Styling | 00:00:00 | ||
Setup CSS Defaults | 00:00:00 | ||
Create A Sticky Footer Position It At The Bottom | 00:00:00 | ||
Source Code | 00:00:00 | ||
Navbar Coding Options For Styling | 00:00:00 | ||
Navbar Options Code | 00:00:00 | ||
Add Styling To Sections | 00:00:00 | ||
Source Code Sections | 00:00:00 | ||
Add Section Background Covers | 00:00:00 | ||
Image Tweaks And Adjustments To CSS | 00:00:00 | ||
Header Update Style | 00:00:00 | ||
Contact Form Styling | 00:00:00 | ||
HTML CSS Source Code | 00:00:00 | ||
Add jQuery To Website | 00:00:00 | ||
Animate Scrolling Of Webpage | 00:00:00 | ||
Update Classes On Scroll | 00:00:00 | ||
Source Code With jQuery | 00:00:00 | ||
Google Fonts And Background Shadows | 00:00:00 | ||
How To Add Social Icons | 00:00:00 | ||
Resources To Update CSS And Customize | 00:00:00 | ||
Final Updates | 00:00:00 | ||
Source Code | 00:00:00 | ||
Website 10 Conclusion | 00:00:00 | ||
Section 17 - Making A Contact Form | |||
Introduction To Making A Contact Form | 00:00:00 | ||
Create HTML Bootstrap Structure | 00:00:00 | ||
Create Form Structure | 00:00:00 | ||
Add PHP Session Holder | 00:00:00 | ||
Source Code Contact Form | 00:00:00 | ||
PHP Get Post Data | 00:00:00 | ||
Anti Spam Check Using PHP | 00:00:00 | ||
PHP Send Email | 00:00:00 | ||
Upload File And Send Email To Email Address | 00:00:00 | ||
PHP Form Fixes | 00:00:00 | ||
PHP Form Mail Source Code | 00:00:00 | ||
jQuery Form Check Setup | 00:00:00 | ||
jQuery Toggle Error Messages | 00:00:00 | ||
Web Contact Form Live Test | 00:00:00 | ||
Web Contact Form Tweaks And Adjustments | 00:00:00 | ||
Complete Web Form Source Code | 00:00:00 | ||
Section 18 - Code Snippets In Action Just Useful Code For Web Development | |||
Code Snippets Introduction | 00:00:00 | ||
Popup Images Using JavaScript | 00:00:00 | ||
Source Code Popup Images | 00:00:00 | ||
Mouse Event Listeners JavaScript | 00:00:00 | ||
Source Code Mouse Event Listeners | 00:00:00 | ||
Section 19 - Conclusion | |||
Complete Websites Conclusion | 00:00:00 |