Companies Home Search Profile

Build a Responsive Web Site from Scratch

Focused View

Guilherme Muller

2:02:46

87 View
  • 01. Introduction.mp4
    03:58
  • lesson1.1.zip
  • 02. The Design.mp4
    04:39
  • 03. Exporting Assets.mp4
    02:54
  • lesson2.1.zip
  • lesson2.2.zip
  • 04. What is a Front-end Workflow.mp4
    03:45
  • 05. Installing Node.js, npm and Gulp.mp4
    06:23
  • 06. Installing Gulp Plugins.mp4
    04:52
  • 07. Creating Gulp Tasks.mp4
    08:31
  • lesson3.1.zip
  • lesson3.2.zip
  • lesson3.3.zip
  • lesson3.4.zip
  • 08. The BEM Methodology.mp4
    05:03
  • 09. Building the HTML Page Structure.mp4
    03:12
  • 10. HTML for the Page Content.mp4
    06:46
  • lesson4.1.zip
  • lesson4.2.zip
  • lesson4.3.zip
  • 11. Sass Partial Structure.mp4
    05:54
  • 12. Responsive Mixins and Functions.mp4
    07:02
  • 13. CSS Reset, Google Fonts and Font Awesome.mp4
    04:36
  • lesson5.1.zip
  • lesson5.2.zip
  • lesson5.3.zip
  • 14. The Grid System Concept.mp4
    04:20
  • 15. Prototyping the Grid in CSS.mp4
    03:03
  • 16. Creating a Responsive Grid Mixin.mp4
    05:40
  • lesson6.1.zip
  • lesson6.2.zip
  • lesson6.3.zip
  • 17. Styling the Header and Navigation.mp4
    05:00
  • 18. Styling the Footer.mp4
    05:28
  • 19. Styling the Page Sections.mp4
    03:29
  • 20. Styling the Portfolio Section.mp4
    03:22
  • 21. Styling the Blog Section.mp4
    03:35
  • 22. Styling the Contact Form.mp4
    03:34
  • 23. Creating a Responsive Hamburger Menu.mp4
    05:57
  • 24. Refining the Responsiveness.mp4
    08:57
  • lesson7.1.zip
  • lesson7.2.zip
  • lesson7.3.zip
  • lesson7.4.zip
  • lesson7.5.zip
  • lesson7.6.zip
  • lesson7.7.zip
  • lesson7.8.zip
  • 25. Conclusion and Next Steps.mp4
    02:46
  • lesson8.1.zip
  • More details


    Front end development has come a long way in recent years. Websites used to be simple, have a small handful of pages, a few jQuery plugins and perhaps some server side functionality for handling form submissions.

    Now, building a modern front-end website involves boilerplates, generators, package managers, task runners, pre-processors and post-processors. And the complexity in web development continues to grow with many moving parts. It’s confusing and overwhelming to those just starting or transitioning from older techniques.

    In our course Responsive Web Development, we’ll give you the blueprint for building modern responsive websites. Guilherme Müller walks you through the process of building a front end workflow using powerful tools and concepts. Not only does this course cover the theory of modern responsive web development, you’ll learn how to apply each of these fundamental concepts in practice. By building a single-page portfolio website, step by step we’ll demonstrate each concepts by action.

    Specifically, we’ll be covering:

    • How to work with the command line
    • Node.js and its npm package manager
    • Gulp for running common development tasks
    • Sass for pre-processing your styles and building your responsive grid system
    • Autoprefixer for automatically adding vendor prefixes
    • BrowserSync for automatically reloading the browser and for remote device testing
    • Using the BEM naming convention for organizing your HTML and CSS as reusable components

    To complete this course we’ll be using a web browser, a text editor, and a command line interface. You’ll need to be comfortable with HTML, CSS, and JavaScript to follow along with this intermediate level course. It can be tricky.

    Once you’ve completed this course, you may want to check out Functional JavaScript Programming, learn about how the web is progressing and JavaScript is moving forward with functional programming.

    User Reviews
    Rating
    0
    0
    0
    0
    0
    average 0
    Total votes0
    Focused display
    Guilherme Muller
    Guilherme Muller
    Instructor's Courses
    Guilherme is a freelance full-stack developer with over 10 years of experience working with websites. With a passion for HTML and CSS, he specializes in the intricacies of building and structuring web pages and layouts.
    Learn Web Design & Development with SitePoint tutorials, courses and books - HTML, CSS, JavaScript, PHP, Responsive Web Design.
    • language english
    • Training sessions 25
    • duration 2:02:46
    • English subtitles has
    • Release Date 2023/09/25