HOME > IT & Software > Full Stack Series [FREE SEGMENT of PART1]

Full Stack Series [FREE SEGMENT of PART1]

SynopsisFull Stack Series – [FREE SEGMENT of PART1], available...
Full Stack Series [FREE SEGMENT of PART1] No.1

Full Stack Series – [FREE SEGMENT of PART1], available at Free, has an average rating of 4.1, with 107 lectures, based on 25 reviews, and has 3304 subscribers.

Free Enroll Now

You will learn about Fine grained steps and instructions Learn basics of HTML and CSS Build an about page for an imaginary Pastry Shop Learn basic HTML tags, CSS styling and layout to build the about page This course is ideal for individuals who are Graduates or Developers looking to enhance their skills or Whomever want to become a Full Stack Trainer It is particularly useful for Graduates or Developers looking to enhance their skills or Whomever want to become a Full Stack Trainer.

Enroll now: Full Stack Series – [FREE SEGMENT of PART1]

Summary

Title: Full Stack Series – [FREE SEGMENT of PART1]

Price: Free

Average Rating: 4.1

Number of Lectures: 107

Number of Published Lectures: 107

Number of Curriculum Items: 107

Number of Published Curriculum Objects: 107

Original Price: Free

Quality Status: approved

Status: Live

What You Will Learn

  • Fine grained steps and instructions
  • Learn basics of HTML and CSS
  • Build an about page for an imaginary Pastry Shop
  • Learn basic HTML tags, CSS styling and layout to build the about page

    • Who Should Attend

  • Graduates
  • Developers looking to enhance their skills
  • Whomever want to become a Full Stack Trainer

    • Target Audiences

  • Graduates
  • Developers looking to enhance their skills
  • Whomever want to become a Full Stack Trainer

    • Welcome to PART 1 of the Full Stack Development course series.

    This is a beginner friendly course.

    Learn Full Stack Development by building a website for an imaginary pastry shop.

    This is a segment of the first part of the Full Stack Development course series.

    The following is the summary of what you will learn in this course:

  • You will learn to build the about page of the pastry shop website.

  • As part of building this website, you will learn:

  • To create HTML web page.

  • Style the web page using CSS.

    • In HTML, you will learn about DOCTYPE, html, body, heading, title, meta, charset, favicon, image, alt attribute, div and nav.

    You will learn the above HTML topics by implementing the web page of Our Story web page of the imaginary pastry shop. Following are the features that will be implement in the Our Story web page:

  • Title and favicon image will be included

  • The navigation bar will be created on the top with logo and navigation item

  • Heading will be included in this page

  • In the main content of the web page images will be included

  • You will also learn to build web page considering people having accessibility issues

    • In CSS, you will learn  Inline style, external style, element selector, class selector, color, background color, padding, border, margin, box model, text align, font family, font weight, font size, height, width, layout, flex and flex wrap.

    The course contains step by step instructions, to make a beginner comfortable with coding and tools.

    Visual Studio Code will be the editor used and you will be taught all the techniques to quickly code with features like emmet abbreviation and command palette.

    Course Curriculum

    Chapter 1: Introduction

    Lecture 1: Introduction

    Lecture 2: Learning Environment

    Lecture 3: Video Settings

    Lecture 4: Install Chrome Browser

    Lecture 5: Download Visual Studio Code

    Lecture 6: Install Visual Studio Code for Windows

    Lecture 7: Install Visual Studio Code for Mac

    Lecture 8: Quick Launch Visual Studio Code

    Lecture 9: Install Live Server Extension

    Chapter 2: Understanding Our Story web page

    Lecture 1: Patisserie – Our Story

    Lecture 2: Folder Structure

    Lecture 3: Create folder and open in Visual Studio Code

    Lecture 4: Create learn folder

    Lecture 5: Create html folder

    Chapter 3: Build Our Story web page with HTML

    Lecture 1: Create HTML file for Our Story web page

    Lecture 2: Include DOCTYPE

    Lecture 3: DOCTYPE explained

    Lecture 4: Include <html> tag

    Lecture 5: <html> tag explained

    Lecture 6: Include <body> and <heading>

    Lecture 7: Launch Our Story web page

    Lecture 8: Styling Limitation in HTML

    Lecture 9: <body> tag explained

    Lecture 10: <head> tag explained

    Lecture 11: What is HTML?

    Lecture 12: Our Story web page Title

    Lecture 13: Translate title to French

    Lecture 14: Include <title> tag

    Lecture 15: Check how title is displayed in the web page

    Lecture 16: Include <meta> tag with charset to fix title display

    Lecture 17: Saving file using shortcut key in Visual Studio Code

    Lecture 18: <head>, <title>, <meta> explained

    Lecture 19: Title explained

    Lecture 20: HTML Attributes explained

    Lecture 21: What is Favicon?

    Lecture 22: Download resources.zip for getting favicon image

    Lecture 23: Copy downloaded resources.zip file

    Lecture 24: Place resources.zip file in fsd folder

    Lecture 25: Extract resources.zip file

    Lecture 26: Verify resources folder

    Lecture 27: Favicon image and its creation steps

    Lecture 28: Create images folder and copy favicon image file

    Lecture 29: Delete resources.zip

    Lecture 30: Include <link> tag for favicon

    Lecture 31: Launch Our Story web page using Live Server extension

    Lecture 32: Favicon link tag explained

    Lecture 33: Include Paris street image

    Lecture 34: Understanding images and copyrights

    Lecture 35: <img> tag explained

    Lecture 36: What is a Screen Reader?

    Lecture 37: Significance of alt attribute

    Lecture 38: Include text

    Lecture 39: HTML Element Alignment

    Lecture 40: Apply border to view HTML Element boundary

    Lecture 41: Analyze HTML layout

    Lecture 42: Limitations of HTML Layout

    Lecture 43: An analogy for <div> tag

    Lecture 44: <div> tag layout for Navigation bar

    Lecture 45: Cleaning up the styles

    Lecture 46: Inclusion of navigation using emmet

    Lecture 47: Understanding Intellisense and <div> tag generation

    Lecture 48: Include navigation content

    Lecture 49: View navigation elements in browser

    Lecture 50: Change navigation <div> to <nav>

    Lecture 51: <div> to enclose the Our Story web page content

    Lecture 52: Introduction to Command Palette

    Lecture 53: Understanding Visual Studio Code commands

    Lecture 54: Open Command Palette

    Lecture 55: Executing a command with Command Palette

    Lecture 56: Include outer most <div> using Command Palette

    Lecture 57: Get the book cover image file

    Lecture 58: Including bottom part of Our Story web page

    Chapter 4: Learn styling and page layout using CSS

    Lecture 1: Create css folder

    Lecture 2: Create HTML file learning selector

    Lecture 3: Include main HTML tags

    Lecture 4: Understanding style attribute

    Lecture 5: Applying style to multiple tags

    Lecture 6: Including multiple <h2> tags

    Lecture 7: Create stylesheet file

    Lecture 8: Define external styles

    Lecture 9: Linking HTML and external stylesheet

    Lecture 10: Applying styles for all <h2> tags

    Lecture 11: How external CSS works?

    Lecture 12: Implement Class Selector

    Lecture 13: Class Selector explained

    Lecture 14: Create HTML file for learning CSS styling

    Lecture 15: Applying Font Color

    Lecture 16: Display Visual Studio Code and Browser adjacently

    Lecture 17: Applying Background Color

    Lecture 18: Applying Padding

    Lecture 19: Applying Border

    Lecture 20: Applying Margin

    Lecture 21: Box Model

    Lecture 22: Applying Padding, Border and Margin to specific sides

    Lecture 23: Apply Text Alignment

    Lecture 24: Introduction to Fonts

    Instructors

  • Full Stack Series [FREE SEGMENT of PART1] No.2
    Chandrasekaran Janardhanan
    Facilitator at SIMPL Academy

    • Rating Distribution

  • 1 stars: 0 votes
  • 2 stars: 0 votes
  • 3 stars: 7 votes
  • 4 stars: 10 votes
  • 5 stars: 8 votes

    • Frequently Asked Questions

    How long do I have access to the course materials?

    You can view and review the lecture materials indefinitely, like an on-demand channel.

    Can I take my courses with me wherever I go?

    Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!

    • Random Picks
    • Popular
    • Hot Reviews
    Prev：The Copywriting Formula- Write Copies to Sell Like a Pro Next：WordPress-Quick And Easy Video Tutorial Series for Beginners