The Complete Web Developer Course – Build 20 Websites

S$30.00
Take This Course
The Complete Web Developer Course – Build 20 Websites

Course Description
This course was funded through a massively successful Kickstarter campaign.

Learn how to build websites for your business or your portfolio. This is the best course to learn how to build websites with HTML CSS and JavaScript. In this course you learn by doing. Build your own fantastic websites today.

One of the best features is that you can watch the courses at any speed you want. This means you can speed up the or slow down the video if you want to.

This course is project based so you will not be learning a bunch of useless coding practices. At the end of this course you will have real world apps to use in your portfolio. We feel that project based training content is the best way to get from A to B. Taking this course means that you learn practical, employable skills immediately.

Learning how to code is a great way to jump in a new career or enhance your current career. Coding is the new math and learning how to code will propel you forward for any situation. Learn it today and get a head start for tomorrow. People who can master technology will rule the future.

You will get full lifetime access to this course for a single one off fee. John Bura has created many games, apps and training courses so he is extremely qualified to teach you how to master technology. This is an instructor that does not only teach, he produces apps. This means you get the most relevant information on how to code. Most courses do not show you practical skills and real world examples.

What makes you a good teacher?

I have released over 40 games and apps that have done very well in the app store.
I run a company called Mammoth Interactive so I am actively in the field building apps and making money
I have been teaching since 2002
I personally love learning online and my life is much better because I have learned online rather than a classroom
I am one of the top 10 highest grossing Udemy teachers
I have been a Udemy instructor since 2011.
I make sure people learn how to make money from their creations.
I have over 110k students worldwide
Who is this class for?

People who want to improve their technical skills
Complete beginners
People who want to make money. I show people the tools on how to make money through various methods of passive income
People who want to get ahead of the pack by learning online.
How you will make money by learning new skills

Learn practical skills
Learn about how leverage your new skills to greater wealth
Learn through practical examples
Why should you learn online?

There is an online education revolution taking place. You may have heard about it in the news or heard it from a friend. Either-way, education is going to be changed forever. In this short course I talk about how Online Education has

Motivated me

Helped my career

Helped me as a teacher

Impacted several lives around the planet

I promise that this course will be better and more effective than reading books. I show how to master technology through the use of video. This course will give you everything you need to thrive in our technological society.

What are the requirements?
Need to know how to use a computer
JSBin (free web building website)
What am I going to get from this course?
Learn to build your own websites.
Learn how to code in CSS
Learn to code in JavaScript
Learn to code in HTML
Build 20 fantastic websites
Start a web design business
Make money from this course
What is the target audience?
Complete beginners
People who want to learn to make websites
Not professional programmers

Curriculum

Section 1: Introduction to the course
Promo Video
00:56
What you need for this course
07:17
Section 2: Basic one page website
01. Introduction to the basic one page website
02:58
02. Setting up an image
01:25
03. Selecting a coffee bean image
01:56
04. Setting up a column
02:35
05. Adding in latin text and the other columns
01:17
06. Setting up the body CSS
01:17
07. Adding in the h1 and h2 css
01:50
08. Changing the header
01:09
09. Formating the header tag
01:50
10. Adding in the banner tag
01:25
11. Making the 3 columns work
03:40
12. Fixing the image
01:49
13. Changing the text and talking about the letters
02:40
14. Challenge – Add links to the website
02:16
Section 3: Background image website
01. Introduction to the background image website
02:28
02.Adding in the three columns
01:52
03. Adding in a background image
01:41
04. Setting the resize features for the image
02:00
05. Adding in the text formats for the headers
02:12
06. Setting up the logo size
02:18
07. Adding in the three columns
02:34
08. Formatting the titles of the 3 columns
01:30
09. Adding in the margin to the header
01:54
10. Adding in a semi transparent background to see the text
03:23
11. Changing the header 2
01:47
12. Adding in the logo and talking about busines
02:07
13. Challenge – Think like a business
01:29
Section 4: 03. Making a 6 column website
01. Introduction to making a six column website
01:44
02. Adding in the 6 columns
01:57
03. Adding in the background image
02:19
04. Adding in the header code
02:16
05. Adding in the logo formatting
02:18
06. Adding in the columns
02:31
07. Changing the header of the columns
01:23
08. Adding in a background to the columns
02:13
09. Making the text pop out
03:14
10. Adding in a graphic logo to the top
03:06
11. Challange – Add in a footer
00:50
Section 5: Making a minimalist website
01. Making a minimalist website
01:47
02. Adding in the columns
01:49
03. Adding in a background color
02:07
04. Adding in the header code
02:37
05. Adding in the columns
02:45
06. Testing boundaries and fixing the logo
01:57
07. Adding in the code for the fontawesome
02:53
08. Adding in the HTML to make FontAwesome work
01:09
09. Adding in an item using FontAwesome
01:58
10. Adding in the icons to the columns
01:41
11. Changing the header2 text
01:57
12. Changing the margins of the entire page and talking about color
02:35
13. Adding in a splash of color and span tags
02:17
14. Adding in the font awesome icons that make sense
04:20
15. Challange – Find a different color scheme
01:10
Section 6: Making a Basic minimalist site with outlines
01. Making a basic minimalist site
01:50
02. Adding in the columns
01:46
03. Adding in the body CSS code
01:25
04. Changing the header CSS
01:33
05. Adding in the header code and the logo code
01:29
06. Adding in the columns
02:19
07. Setting up font awesome
02:15
08. Setting up the logos in the page
02:23
09. Adding in a span tag
02:24
10. Adding in a stroke
02:32
11. Adding in a specific span tag
02:15
12. Playing around with color
04:20
13. Challenge – find a good colorscheme
00:21
Section 7: Making a bigger website
01. Introduction to making a bigger website
01:39
02. Adding in the div tags
03:06
03. Adding in the body CSS
02:29
04. Adding in the header css
03:10
05. Adding in the div section formatting
01:59
06. Adding in the columns
02:29
07. Adding in a full width background color
01:43
08. Adding the dimensions to the paragraphs
01:38
09. Adding full width to the paragraph sections
01:32
10. Adding in the logo CSS
01:56
11. Adding in the font awesome logic
01:56
12. Adding in the font awesome SVG graphics
02:23
13. Changing the icons
01:01
14. Changing the H2 to look better
02:19
15. Changing the paragraph text
01:24
16. Adding a span to the title
01:38
17. Adding in the second span tag
02:39
18. Challenge – Add another div tag to the project
00:35
Section 8: Learn about Scaleable websites
01. Introduction to multiple div tag website
01:28
02. Adding in the section div tags
02:12
03. Setting up the background color
02:42
04. Adding in a class to the sections
01:28
05. Adding in the section CSS
02:02
06. Fixing the font
02:03
07. Adding in the logo CSS
02:10
08. Adding in span tags
02:15
09. Changing the second color
02:12
10. Stretching the letters
03:35
11. Justifying the text
01:20
12. Challenge – Add in columns and FontAwesome icons
01:05
Section 9: Interchanging graphics and div tags
01. Introduction to the website
01:37
02. Adding in the rest of the HTML
02:10
03. Adding in the body and header CSS
01:43
04. Adding in the logo CSS
01:32
05. Adding in the class content
01:53
06. Adding in test colors
02:18
07. Adding in images to the div tags
02:32
08. Setting up the background image
02:18
09. Setting the other div tag images
01:55
10. Adding in the padding and changing the text size
01:30
11. Making the text pop out over the images
02:19
12. Adjusting the Header 2
02:29
13. Changing the logo color
01:43
14. Challenge – Change the div tag to a dark green and make it work
01:47
Section 10: Building a bigger website
01. Introduction to the website
01:18
02. Adding in the sections
02:17
03. Adding in the h1 and h2 CSS
01:37
04. Adding in the logo CSS
01:39
05. Adding in the class settings
01:59
06. Adding in the sections
03:57
07. Adding in the images
02:37
08. Formatting the top image
01:09
09. Making the picture bigger
01:08
10. Adding a background to the image text
01:39
11. Adding the white text to the blue items
01:14
12. Adding in the h2 code
01:45
13. Addingt in the orange text
01:45
14. Adding in the orange text to a different header
02:08
15. Adding in the blue text
02:02
16. Adding in the white text and blue text
02:32
17. Fixing a div tag and making the text justified
01:06
18. Challenge – Make a different theme to work with the black and white images
00:42
Section 11: The elegance of serif fonts
01. Introduction to the project
01:33
02. Adding in the sections
01:35
03. Adding in the body text
01:19
04. Formatting the headers
01:25
05. Adding in the horizontal rule
01:50
06. Adding in a symbol to the horizontal rulke
02:23
07. Formatting the logo
01:21
08. Formatting the section
02:34
09. Adding in the h2 CSS
01:21
10. Setting up the title
01:48
11. Separating the title into 3 header tags
02:10
12. Setting the size for the titles
01:14
13. Setting up the title
01:58
Section 12: Making a photography website
01. Introduction to the photography website
01:24
02. Adding in the photograph sections
01:59
03. Adding in the text sections
01:31
04. Adding int he body text
01:18
05. Adding in the header code
03:15
06. Learning about font juxtaposition
02:34
07. Adding in the header logo
01:26
08. Formatting the text
02:59
09. Setting up the columns
01:44
10. Adding in the columns
03:05
11. Adding in images
01:13
12. Adding in cat pictures
02:16
13. Formatting the images
03:12
14. Fixing the columns
01:40
15. Fixing the title
02:08
16. Adding in the HR code
02:24
17. Challenge – Add another 9 photo section
01:18
Section 13: Video Background Website
01. Introduction to the video background
02:36
02. Adding in the text
02:45
03. Formatting the body
02:13
04. Changing the h1 and h2
01:31
05. Putting the text in the center
01:44
06. Formatting the text
02:53
07. Adding in the HTML 5 video code
01:46
08. Finding public domain HD videos
02:16
09. Adding in a div and a class container
01:53
10. Formatting the video
02:26
11. Formatting the text to fit the video
02:52
12. Adding in more text
02:07
13. Final touches on text
01:49
14. Adding in the CSS to the horizontal rule
01:49
15. Challenge – Add in the background to the text area
00:57
Section 14: Making an extended video website
01. Introduction to the extended video background website
02:05
02. Adding in the text
02:05
03. Adding in the video
01:03
04. Adding in the video CSS
02:35
05. Adding in the body and header CSS
01:37
06. Adding in the container CSS
01:11
07. Adding padding to the page
02:32
08. Adding a div tag to make the backgrounds work
01:49
09. Fixing the background video so that it doesn’t stretch
01:20
10. Selecting the background color
02:08
11. Adding in the text color to the paragraph div
02:11
12. Picking the colors of the website
03:16
13. Adding in the HR code
02:54
14. Challenge – find a different color scheme that works with this background
01:11
Section 15: Making a website with a menu bar
01. Introduction to menu bars
02:05
02. Setting up the unordered list
01:54
03. Adding in the logo section
02:38
04. Adding in the other sections
01:48
05. Setting up the body color
01:39
06. Setting up the menu bar
01:50
07. Adding in the link values
02:26
08. Formatting the banner
01:10
09. Adding in the logo text
03:03
10. Adjusting the header text
02:28
11. Adding in the width of the sections
02:11
12. Setting up the other sections
02:20
13. Setting up the header 2
02:38
14. Adjusting the logo
01:30
15. Setting up one word to be green
02:53
16. Making the menu center
01:36
17. Adding in the page jumps
03:12
18. Changing the paragraph color for the green text
01:24
19. Fixing up the header paragraph
01:03
20. Challenge – Add in some font awesome icons
01:41
Section 16: Learn to make classy horizontal rules
01. Introduction
01:51
03. Adding in the top list
02:06
04. Adding in some more HTML and adding hte body CSS
01:46
05. Adding in the list items
02:09
06. Adding more CSS to the #nav feature
01:49
07. Adding in the banner code
04:51
08. Adding in the full width colors
02:21
09. Formatting the sections to the right width
01:55
10. Formatting the section text
01:59
11. Adding in the h2 CSS
01:22
12. Adding color to the headers HTML
02:18
13. Adding in the colors to the headers CSS
02:13
14. Adding the links to the list
02:01
15. Adding in the triangles part 1
02:36
16. Adding in the triangles part 2
02:03
17. Challenge – Add a triangle to the top
00:32
Section 17: A circle themed website
01. Introduction
01:36
02. Adding in the text to the title
01:43
03. Adding in the other sections
01:47
04. Adding in the #nav code
02:23
05. Adding more unordered list CSS code
01:04
06. Adding in the section colors
01:49
07. Adding in the section CSS
02:48
08. Adding in the H2 CSS
01:53
09. Adding in the circle
02:47
10. Fixing the top circle
02:18
11. Adding in the header CSS
02:18
12. Adding in the yellow and white text HTML
01:35
13. Changing the text to yellow
01:37
14. Adding in an outline
01:33
15. Adding in the circle part 1
02:01
16. Adding in the other circles
02:54
Section 18: Columns and circles
01. Introduction
01:38
02. Setting up the column HTML
01:25
03. Adding in the circles and doing some math
02:04
04. Optimizing the circle CSS
01:49
05. Putting in the circles into columns
02:34
06. Puttin the text in the center
01:10
07. Adding in the top menu
01:55
08. Adding in the body and a tag CSS
01:49
09. Making the top menu bar
02:33
10. Fixing the circle text
01:21
11. Adding in the colors of the circles
03:13
12. Adding in the section HTML
02:29
13. Adding in the colors to the sections
02:28
14. Adding in the section code to format the page
02:10
15. Setting up the header 2
02:34
16. Formatting the h2 with a span tag
03:39
17. Adding in the orange color
02:49
18. Formatting the top bar color
02:14
19. Challenge – add in fancy horizontal rules
00:35
Section 19: Making a one page website by changing the text
01. Introduction
01:59
02. Adding in the un ordered list
01:31
03. Adding in the body code and the header code
02:59
04. Adding in the HTML to change
01:39
05. Changing the header
01:12
06. Fitting the text onto one page
01:39
07. Formatting the paragraph tag
02:39
08. Setting up the background text with padding
01:28
09. Adding in javascript buttons
01:48
10. Adding in a function to the buttons
01:59
11. Changing the rest of the text
03:17
12. Changing the background color with javascript
02:00
13. Adding in the colors to the project
03:42
14. Adding in the background paragraph color
02:24
15. Adding in the colors to the list items
02:37
16. Challange – Make a website for a business
01:11
Section 20: Making a colorful website
01. Introduction
01:25
02. Adding in the sections
01:50
03. Adding the body CSS
02:04
04. Adding in the H1 CSS
01:31
05. Adding in the header 2 logic
01:09
06. Adding in the section content logic
01:57
07. Adding in bright colors
03:09
08. Adding in the color of the text
02:04
09. Adding in the spans to change the color
03:23
10. Adding in the css to make the letters a different color
03:21
11. Adding the colorful Letters to lorem Ipsum
02:02
12. Adding in the other themes
03:54
13. Adding in the paragraph and final touches
01:41
Section 21: Adding a menu at the bottom
01. Introduction
01:46
02. Adding in the menu div tags
01:20
03. Adding in the buttons and the list itmes
02:53
04. Adding in the button and body CSS
03:07
05. Setting up the buttons
01:31
06. Setting up the banner and paragraph CSS
02:59
07. Fixing the menu bar
02:10
08. Adding in the colors to the menu bar
03:18
09. Testing the JavaScript
01:48
10. Setting up the function before we copy and paste
02:41
11. Adding in the rest of hte functions
03:52
12. Taking about solving problems and how to do it effectively
02:51
13. Adding in some final touches
02:41
14. Challenge – expand upon this website
00:43
Quotes
300 pages

Instructor Biography
John Bura, Best Selling Instructor Web/App/Game Developer 250k Students
John Bura is has been a successful Udemy instructor since 2011. John Bura has been programming games since 1997 and teaching since 2002. John is the owner of the game development studio Mammoth Interactive. This company produces XBOX 360, iPhone, iPad, android, HTML 5, ad-games and more. Mammoth Interactive recently sold a game to Nickelodeon! John has been contracted by many different companies to provide game design, audio, programming, level design and project management. To this day John has 40 commercial games that he has contributed to. Several of the games he has produced have risen to the top 10 in the Apple’s app store. In his spare time John likes to play ultimate Frisbee, cycle and work out.

Course Features

  • Lectures
    Fatal error: Uncaught Error: Call to undefined method LP_Course::get_lessons() in /home2/waf6oo0adwwo/public_html/wp-content/themes/eduma/inc/learnpress-v2-functions.php:624 Stack trace: #0 /home2/waf6oo0adwwo/public_html/wp-content/themes/eduma/learnpress-v2/single-course/content-landing.php(64): thim_course_info() #1 /home2/waf6oo0adwwo/public_html/wp-content/plugins/learnpress/inc/lp-template-functions.php(2492): include('/home2/waf6oo0a...') #2 /home2/waf6oo0adwwo/public_html/wp-content/themes/eduma/learnpress-v2/content-single-course.php(65): learn_press_get_template('single-course/c...', Array) #3 /home2/waf6oo0adwwo/public_html/wp-content/plugins/learnpress/inc/lp-template-functions.php(2492): include('/home2/waf6oo0a...') #4 /home2/waf6oo0adwwo/public_html/wp-content/plugins/learnpress/inc/lp-template-functions.php(1563): learn_press_get_template('content-single-...') #5 /home2/waf6oo0adwwo/public_html/wp-includes/class-wp-hook.php(286): learn_press_content_single_course('') #6 /home2/waf6oo0adwwo/public_html/wp-i in /home2/waf6oo0adwwo/public_html/wp-content/themes/eduma/inc/learnpress-v2-functions.php on line 624