Code a Small Business Website using popular web frameworks
Code a Small Business Website using popular web frameworks, available at $44.99, has an average rating of 4.29, with 137 lectures, based on 7 reviews, and has 102 subscribers.
You will learn about Learn to create a Small Business Website with 5 pages and all the relevant sections and content Learn how each framework uses different code structure, classes and attributes to create the same kind of component Learn how each framework differ in the visual style of each component Learn what is possible and what isn't with each framework This course is ideal for individuals who are Beginning web designers and developers who want know the most popular frameworks or Web designers and developers who know one of the frameworks, but are curious to see how it compares to other frameworks or UX Designers and Art Directors who want to learn how to create quick prototypes with code It is particularly useful for Beginning web designers and developers who want know the most popular frameworks or Web designers and developers who know one of the frameworks, but are curious to see how it compares to other frameworks or UX Designers and Art Directors who want to learn how to create quick prototypes with code.
Enroll now: Code a Small Business Website using popular web frameworks
Summary
Title: Code a Small Business Website using popular web frameworks
Price: $44.99
Average Rating: 4.29
Number of Lectures: 137
Number of Published Lectures: 137
Number of Curriculum Items: 137
Number of Published Curriculum Objects: 137
Original Price: €219.99
Quality Status: approved
Status: Live
What You Will Learn
- Learn to create a Small Business Website with 5 pages and all the relevant sections and content
- Learn how each framework uses different code structure, classes and attributes to create the same kind of component
- Learn how each framework differ in the visual style of each component
- Learn what is possible and what isn't with each framework
Who Should Attend
- Beginning web designers and developers who want know the most popular frameworks
- Web designers and developers who know one of the frameworks, but are curious to see how it compares to other frameworks
- UX Designers and Art Directors who want to learn how to create quick prototypes with code
Target Audiences
- Beginning web designers and developers who want know the most popular frameworks
- Web designers and developers who know one of the frameworks, but are curious to see how it compares to other frameworks
- UX Designers and Art Directors who want to learn how to create quick prototypes with code
ABOUT THE COURSE
This course is for the beginner who wants to get a quick introduction to various popular front-end CSS frameworks by recreating the same project multiple times. By taking this course you’ll get introduced to the latest versions of Bootstrap 4, Bootstrap 5, Bulma, Semantic UI, Foundation 6 and Materialize. These frameworks are some of the most popular ones used today by web designers and developers all over the world.
In this course you’ll learn how to create a Small Business Website using various popular front-end CSS frameworks. Using one framework at a time I will start from scratch and walk you through how to create the same project. The project created with each framework will have the same general layout and design, however there will be some small visual differences from project to project due to the specific features and styles of the various frameworks.
The idea behind re-creating the same project with different frameworks is to learn how each framework use different code structure, classes and attributes to create the same kind of component. You will also learn how each framework differ in the visual style of each component, and learn what is possible and what isn’t with each framework.
ABOUT THE PROJECT
This project is about creating a Small Business Website. You’ll learn how to structure various pieces of content, how to design a user-friendly interface, and how to make it look great on all device sizes by using a responsive grid.
The project will contain the following pages:
-
Home
Menu, dropdown, hero section, message, highlights, responsive grid layout with cards, footer with icons -
Services
Menu, dropdown, responsive grid layout with large images, text and buttons, footer with icons -
About
Menu, dropdown, text, responsive grid layout with images, footer with icons -
Team
Menu, dropdown, responsive grid layout with images, icons and headings, footer with icons -
Contact
Address, opening hours, contact form, embedded Google Maps
ABOUT THE FRAMEWORKS
The following frameworks will be used to create a Small Business Website:
-
Bootstrap 4 (compatible with the latest version v4.6.0)
-
Bootstrap 5 (compatible with the latest version v5.1.0)
-
Bulma (compatible with the latest version v0.8.0)
-
Semantic UI (compatible with the latest version v2.4.2)
-
Foundation 6 (compatible with the latest version v6.5.3)
-
Materialize (compatible with the latest version v1.0.0)
Bootstrap 4:
We’ll use the following parts of Bootstrap 4:
-
Layout: Containers, Grid system
-
Content: Typography, Images
-
Components: Alert, Button, Card, Dropdown, Forms, Input Group, Jumbotron, Navbar
-
Utilities: Border, Embed, Flex, Spacing, Text
Bonus:
As a bonus you’ll also learn how to useFont Awesome 5 to add icons to your project and how to useGoogle Fonts to add web fonts to your project.
Bootstrap 5:
We’ll use the following parts of Bootstrap 5:
-
Layout: Containers, Grid system
-
Content: Typography, Images
-
Components: Alert, Button, Card, Dropdown, Forms, Input Group, Navbar
-
Utilities: Border, Embed, Flex, Spacing, Text
Bonus:
As a bonus you’ll also learn how to useFont Awesome 5 to add icons to your project and how to useGoogle Fonts to add web fonts to your project.
Bulma:
We’ll use the following parts of Bulma:
-
Modifiers: Color Helpers, Typography Helpers
-
Layout: Columns, Container, Footer, Hero, Section
-
Forms: General, Input, Select, Textarea
-
Elements: Button, Content, Icon, Image, Notification, Title
-
Components: Card, Dropdown, Navbar
Bonus:
As a bonus you’ll also learn how to useFont Awesome 5 to add icons to your project.
Semantic UI:
We’ll use the following parts of Semantic UI:
-
Elements: Button, Container, Header, Icon, Image, Input, List
-
Collections: Form, Grid, Menu, Message
-
Modules: Dropdown, Embed
-
Views: Card
Foundation 6:
We’ll use the following parts of Foundation 6:
-
General: XY Grid, Forms, Icons
-
Utilities: Prototyping Utilities
-
Controls: Button
-
Navigation: Top Bar, Menu
-
Containers: Callout, Card, Dropdown
Materialize:
We’ll use the following parts of Materialize:
-
CSS: Color, Grid, Helpers, Media
-
Components: Buttons, Cards, Footer, Icons, Navbar
-
JavaScript: Dropdown, Sidenav
-
Forms: Select, Text Inputs
—
I hope you will be inspired to create your own Small Business Website afterwards. Please send me a link if you do so. I would love to see it!
Course Curriculum
Chapter 1: Introduction
Lecture 1: About the Course
Lecture 2: Projects Overview and Demos
Lecture 3: Downloading and Installing Bootstrap 4
Lecture 4: Downloading and installing Bootstrap 5
Lecture 5: Downloading and Installing Bulma
Lecture 6: Downloading and Installing Semantic UI
Lecture 7: Downloading and Installing Foundation 6 (Customized Version)
Lecture 8: Downloading and installing Materialize
Lecture 9: Downloading and Installing Font Awesome v5.1.0
Chapter 2: Comparison of Frameworks
Lecture 1: Learning Kit
Lecture 2: Badge
Lecture 3: Breadcrumb
Lecture 4: Breakpoints
Lecture 5: Button
Lecture 6: Button Group
Lecture 7: Card
Lecture 8: Color
Lecture 9: Dropdown
Lecture 10: Form Fields I
Lecture 11: Form Fields II
Lecture 12: Grid
Lecture 13: Message
Lecture 14: Navbar
Lecture 15: Pagination
Lecture 16: Progress
Lecture 17: Tabs
Lecture 18: Tooltip
Lecture 19: Utility Classes
Chapter 3: Bootstrap 4 – Code a Small Business Website
Lecture 1: About the Project
Lecture 2: Home – Installing Icon Font and Web Fonts
Lecture 3: Home – Navigation
Lecture 4: Home – Hero
Lecture 5: Home – Alert
Lecture 6: Home – About
Lecture 7: Home – News
Lecture 8: Home – Footer
Lecture 9: Home – Responsive Adjustments
Lecture 10: Home – Adjustment with Utilities
Lecture 11: Services – Story
Lecture 12: Services – Responsive Adjustments
Lecture 13: Services – Adjustment with Utilities
Lecture 14: About – Story
Lecture 15: About – Office
Lecture 16: About – Clients
Lecture 17: About – Responsive Adjustments
Lecture 18: About – Adjustment with Utilities
Lecture 19: Team – Team
Lecture 20: Team – Responsive Adjustments
Lecture 21: Team – Adjustment with Utilities
Lecture 22: Contact – Address and Hours
Lecture 23: Contact – Message
Lecture 24: Contact – Map
Lecture 25: Contact – Responsive Adjustments
Lecture 26: Contact – Adjustment with Utilities
Chapter 4: Bootstrap 5 – Code a Small Business Website
Lecture 1: About the Project
Lecture 2: Home – Navigation
Lecture 3: Home – Hero
Lecture 4: Home – Alert
Lecture 5: Home – What
Lecture 6: Home – News
Lecture 7: Home – Footer
Lecture 8: Services
Lecture 9: About – Story
Lecture 10: About – Office
Lecture 11: About – Clients
Lecture 12: Team
Lecture 13: Contact – Address
Lecture 14: Contact – Hours
Lecture 15: Contact – Message
Lecture 16: Contact – Map
Chapter 5: Bulma – Code a Small Business Website
Lecture 1: About the Project
Lecture 2: Home – Navigation
Lecture 3: Home – Hero
Lecture 4: Home – Notification
Lecture 5: Home – What We Do
Lecture 6: Home – News
Lecture 7: Home – Footer
Lecture 8: Services
Lecture 9: About – Our Story
Lecture 10: About – Our Office
Lecture 11: About – Our Clients
Lecture 12: Team
Lecture 13: Contact – Address
Lecture 14: Contact – Opening Hours
Lecture 15: Contact – Message
Lecture 16: Contact – Map
Chapter 6: Semantic UI – Code a Small Business Website
Lecture 1: About the Project
Lecture 2: Index – Basic Setup
Lecture 3: Index – Navigation
Lecture 4: Index – Hero
Lecture 5: Index – Message
Lecture 6: Index – About
Lecture 7: Index – News
Lecture 8: Index – Footer
Instructors
-
Jeppe Schaumburg Jensen
Senior software engineer and published author
Rating Distribution
- 1 stars: 0 votes
- 2 stars: 0 votes
- 3 stars: 2 votes
- 4 stars: 3 votes
- 5 stars: 2 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!
You may also like
- Top 10 Language Learning Courses to Learn in November 2024
- Top 10 Video Editing Courses to Learn in November 2024
- Top 10 Music Production Courses to Learn in November 2024
- Top 10 Animation Courses to Learn in November 2024
- Top 10 Digital Illustration Courses to Learn in November 2024
- Top 10 Renewable Energy Courses to Learn in November 2024
- Top 10 Sustainable Living Courses to Learn in November 2024
- Top 10 Ethical AI Courses to Learn in November 2024
- Top 10 Cybersecurity Fundamentals Courses to Learn in November 2024
- Top 10 Smart Home Technology Courses to Learn in November 2024
- Top 10 Holistic Health Courses to Learn in November 2024
- Top 10 Nutrition And Diet Planning Courses to Learn in November 2024
- Top 10 Yoga Instruction Courses to Learn in November 2024
- Top 10 Stress Management Courses to Learn in November 2024
- Top 10 Mindfulness Meditation Courses to Learn in November 2024
- Top 10 Life Coaching Courses to Learn in November 2024
- Top 10 Career Development Courses to Learn in November 2024
- Top 10 Relationship Building Courses to Learn in November 2024
- Top 10 Parenting Skills Courses to Learn in November 2024
- Top 10 Home Improvement Courses to Learn in November 2024