+- Forum Rockoldies (https://rockoldies.net/forum)
+-- Forum: Fotobearbeitung - Photoshop (https://rockoldies.net/forum/forumdisplay.php?fid=16)
+--- Forum: E-Learning, Tutorials (https://rockoldies.net/forum/forumdisplay.php?fid=18)
+--- Thema: Advanced Html Css & Sass - Build And Deploy Modern Websites (/showthread.php?tid=64247)
Advanced Html Css & Sass - Build And Deploy Modern Websites - Panter - 08.12.2022
![[Bild: ewibixoqjafj2iibbarri2wf5u.jpg]](https://abload.de/img/ewibixoqjafj2iibbarri2wf5u.jpg)
Advanced Html Css & Sass - Build And Deploy Modern Websites
Published 8/2022
MP4 | Video: h264, 1280x720 | Audio: AAC, 44.1 KHz
Language: English | Size: 5.79 GB | Duration: 12h 18m
Learn Modern Web Development using HTML5, CSS3 Grid system & Flexbox, CSS Variables, Bootstrap, SASS, GitHub Repository
What you'll learn
How to create websites using HTML & CSS
How to create Responsive website by using CSS Flexbox and Grid Layout model
Learn SASS / SCSS
Website deployment on GitHub pages and Netlify
Create GitHub Repositories
Requirements
Basic PC or Mac
Description
In this Course you will learn the basic skills that every beginner web developer needs, HTML & CSS, by Creating your own Blog Website & Publishing / Deploying it on the internet using GitHub, making it accessible to the hole world.My Name is Norbert B.M. I am a Manager and I teach web development through courses like this and also on my YouTube channel and Blog, where I have tones of education content for you.I am gonna take you from a complete beginner, with 0 experience in creating websites, to a confident coder by teaching you two of the core pillars skills of web development, that is the HTML and CSS programing language.I decided to have a complete practical approach to this course.You will start up with a short Environmental setup, where I will help you setup your coding environment using the most popular code editor on the market. We will also add to it my personal Extensions for coding with speed and efficiency.I will then take you through just a basic introduction about what HTML is and how it works. And then, we will get strait in to creating your very first website. I will slowly drag you into deeper and deeper waters , throwing CSS at you with colors, fonts, Pseudo classes and selector, showing you best practice examples, industry standards and personal tips and tricks, for animations, transitions and reflections, making websites responsive on different devices reaching from Desktop to Tablet and Mobile using Media queries, with everything culminating in publishing your very first website for everyone to visit and experience on the internet using GitHub.What will you learn:How to Setup a Developer EnvironmentHTML & CSS Basics - Build & Deploy Blog Website What is HTMLHTML CommentsHTML Heading ElementsHTML Paragraph & Dummy TextHTML Horizontal Rules and Line BreaksHTML TagHTML StylesHTML ListsHTML LinksHTML <img> TagHTML Semantic ElementsHTML ElementHTML <nav> ElementHTML <section> TagHTML <main> and <article> TagHTML <audio> & <iframe> tagsHTML TagHTML Symbols and IconsWhat is CSSCSS SelectorsHTML Elements ID there CSS selectionHTML Elements Classes and there CSS selectionCSS ColorsCSS BackgroundsCSS BordersCSS Margins and PaddingsCSS Selects All and General ResetText FormattingCSS FontsCSS Height, Width and Max-widthCSS Pseudo-classPseudo-elementCSS Layout - The position PropertyCSS Flexbox Layout ModuleCSS Grid Layout ModuleCreate Multiple Web pagesShared Web Page StructureNavigate between web pagesCSS Forms and Contact informationCSS TransitionsCSS Image ReflectionCSS 2D TransformsCSS AnimationsCSS Media QueriesResponsive About PageResponsive Blog Page and PostResponsive PostWhat is GitHub and How to create a GitHub AccountCreate a GitHub Repository & Publish your websiteCSS VariablesCSS Calc () MethodCSS Flexbox ProjectCSS Grid ProjectVisual Studio Code Extensions and Shortcut keysSASS & SCSS - The CSS with SuperpowersScss UtilitiesScss Project - Button ComponentScss Projects - Alert ComponentScss Project - Card ComponentScss Project - Navbar ComponentProject E-Learning Website using ScssSo join me on this journey and be a proud owner of your very first website and as a byproduct also leave with 3 brand new Skills: HTML CSS and Website Deployment.
Overview
Section 1: Introduction
Lecture 1 Introduction
Lecture 2 Setup Developer Environment
Section 2: Blog website - HTML and CSS Fundamentals
Lecture 3 About this Project
Lecture 4 Source Code Repository and Live Blog Website
Lecture 5 What is HTML and how to create a HTML file
Lecture 6 HTML Elements
Lecture 7 HTML Comments
Lecture 8 HTML Headings
Lecture 9 HTML Paragraphs & Dummy Text
Lecture 10 HTML Horizontal Rules & Line Breaks
Lecture 11 HTML div Element
Lecture 12 HTML Styling
Lecture 13 HTML Lists
Lecture 14 HTML Links
Lecture 15 HTML Imgages
Lecture 16 HTML Semantic Elements
Lecture 17 HTML Tag
Lecture 18 HTML Tag
Lecture 19 HTML Tag
Lecture 20 HTML & Tag
Lecture 21 HTML & tags
Lecture 22 HTML Tag
Lecture 23 HTML Symbols and Icons
Lecture 24 What is CSS & How to create and link CSS to HTML
Lecture 25 CSS Selectors
Lecture 26 HTML ID and there CSS selection
Lecture 27 HTML Classes and there CSS selection
Lecture 28 CSS Colors
Lecture 29 CSS Backgrounds
Lecture 30 CSS Borders
Lecture 31 CSS Margins and Paddings
Lecture 32 CSS Selects All and General Reset
Lecture 33 Text Formatting
Lecture 34 CSS Fonts & External Fonts
Lecture 35 CSS Height, Width and Max-width
Lecture 36 CSS Pseude-class
Lecture 37 CSS Pseudo-element
Lecture 38 CSS Layout - The position Property
Section 3: CSS Flexbox & Grid Layout Module - Blog Website
Lecture 39 CSS Flexbox
Lecture 40 CSS Grid
Section 4: Website Structure and Navigation - Blog Website
Lecture 41 Create Multiple Webpage
Lecture 42 Shared Web Page Structure
Lecture 43 Navigate between web pages
Lecture 44 CSS Form input label & more
Lecture 45 Contact Infos : Email, Phone, Fax, Address and Webpage
Section 5: CSS Animations, Transitions, Transformations and Effects - Blog Website
Lecture 46 CSS Transitions
Lecture 47 CSS Image Reflection
Lecture 48 CSS 2D Transform
Lecture 49 CSS Animations
Section 6: CSS Media Queries - Blog Website
Lecture 50 What are CSS Media Queries
Lecture 51 Responsive About Page
Lecture 52 Responsive Blog Page and Post
Lecture 53 Responsive Post
Section 7: Publishing your Website to GitHub - Blog Website
Lecture 54 What is GitHub & Create a GitHub Account
Lecture 55 Create a Repository & Publish your Website the internet
Section 8: CSS Calc Method
Lecture 56 How to use CSS calc()
Lecture 57 Examples with CSS calc()
Section 9: CSS Variables
Lecture 58 What are CSS Variables
Lecture 59 Using CSS Variables
Section 10: CSS Flexbox Project - Crypto Market Website
Lecture 60 Project overview
Lecture 61 Starter Files
Lecture 62 Website Settings & Variables
Lecture 63 Website Navigation
Lecture 64 Website Header
Lecture 65 Website Services
Lecture 66 Responsive Design
Lecture 67 Finish files
Section 11: CSS Grid Project - Photography Portfolio Website
Lecture 68 Project Overview
Lecture 69 Starter Files
Lecture 70 Website Settings & Variables
Lecture 71 Website Header & Navigation
Lecture 72 Image Collections Section
Lecture 73 Spring / Summer / Fall / Winter Collection
Lecture 74 Finish files
Section 12: Visual Studio Code Extensions and Shortcut keys
Lecture 75 Essential Extensions
Lecture 76 Optional Extensions
Lecture 77 Environmental Specific Extensions
Lecture 78 Essential Keyboard Shortcuts
Lecture 79 Create you own Keyboard Shortcuts & New File Extension
Lecture 80 03-Import other Keymap extensions
Section 13: SASS & SCSS - The CSS with Superpowers
Lecture 81 What is SASS and why learn it ?
Lecture 82 How does Sass work?
Lecture 83 Features of Sass
Lecture 84 Visual Studio Code Sass Compiler
Lecture 85 Working with Scss Partials & @import rule
Lecture 86 Scss Nesting & Parent selector
Lecture 87 Scss Variables
Lecture 88 Scss Data Types - Lists
Lecture 89 Scss @each rule
Lecture 90 Scss Data Types - Maps
Lecture 91 Scss @functions rule
Lecture 92 Scss @mixin & @include rule
Lecture 93 Scss @if and @else
Lecture 94 Scss @extend Classes rule
Section 14: Scss Utilities
Lecture 95 Section overview
Lecture 96 Sandbox and Global Settings
Lecture 97 Global Variables
Lecture 98 Global Maps
Lecture 99 Utility Functions & Mixins
Lecture 100 Utility Classes
Lecture 101 Text alignment classes
Lecture 102 Font size classes
Lecture 103 Padding classes
Lecture 104 Margins classes
Lecture 105 Title & Subtitle Class
Lecture 106 Text and Background Color Classes
Lecture 107 Scss Utilities Files
Section 15: Project - Button Component
Lecture 108 Project overview
Lecture 109 Project resources
Lecture 110 Create a main .btn class
Lecture 111 Create multiple button types
Lecture 112 Create multiple button size
Lecture 113 Create closing buttons
Lecture 114 Finished component
Section 16: Projects - Alert Component
Lecture 115 Project overview
Lecture 116 Project resources
Lecture 117 Create the main .alert class
Lecture 118 Create multiple .alert class types
Lecture 119 Closing Alert with animation
Lecture 120 Example: Form submission with missing input alert.
Lecture 121 Finished component
Section 17: Project - Card Component
Lecture 122 Project overview
Lecture 123 Project resources
Lecture 124 Create main .card class
Lecture 125 Create a card header and footer
Lecture 126 Create multiple card types
Lecture 127 Finished component
Section 18: Project - Navbar Component
Lecture 128 Project overview
Lecture 129 Project resources
Lecture 130 Create .navbar class for multiple screen sizes
Lecture 131 Show hide navbar on click
Lecture 132 Finished component
Section 19: Project E-Learning Website using Scss
Lecture 133 Project Overview
Lecture 134 Online Website and GitHub repository
Lecture 135 Project setup
Lecture 136 Create project variables and general website settings
Lecture 137 Create navigation using navbar component
Lecture 138 Create header section
Lecture 139 Create categories section
Lecture 140 Create offers section
Lecture 141 Create testimonials section
Lecture 142 Create global footer
Lecture 143 Create Login page and form
Lecture 144 Create Registration page form
Lecture 145 Create welcome page
Lecture 146 Make website responsive
Lecture 147 Deploy the website to Netify
Section 20: Project - Cryptocurrency Profit Calculator Mobile App
Lecture 148 Project overview
Lecture 149 Create a GitHub Repository for the project
Lecture 150 Starter Files & HTML description
Lecture 151 Project Setup & Variables
Lecture 152 Form component
Lecture 153 Results component & Mobile design
Lecture 154 Publish application to GitHub Pages
Section 21: Extra section
Lecture 155 Bonus lectur
Beginner web developers that just got started,Beginner Front End web developers,Beginner HTML,Beginner CSS,Beginner Sass,Advanced HTML web developers,Advanced CSS web developers
![[Bild: advancedhtmlcsssassbuzacky.jpg]](https://abload.de/img/advancedhtmlcsssassbuzacky.jpg)
Download from RapidGator
Download from DDownload