Learn Web Code

Become a WordPress Developer: Unlocking Power with Code

Join full 26hr course: https://www.udemy.com/become-a-wordpress-developer-php-javascript/?couponCode=YOUTUBEFULLCOURSE

Timestamps:
0:0:14 Quick Overview
0:2:06 Detailed Overview
0:12:05 Installing WordPress Locally
0:25:35 First Taste of PHP
0:41:55 Create Theme
0:54:20 Functions
1:09:14 Arrays
1:21:43 The Loop
1:36:10 Header & Footer
1:54:44 Convert HTML/CSS Into Theme
2:14:42 Interior Page Template
2:32:28 Parent / Child Pages
2:49:16 When do we need to echo?
2:58:17 Children Links Menu

Follow me on Twitter for webDev updates and cat pics: https://twitter.com/learnwebcode
Visual Studio Code: HTML, CSS & JS Tips

WordPress Dev Course: https://www.udemy.com/become-a-wordpress-developer-php-javascript/?couponCode=YOUTUBEDEAL
Front-End Workflow Course: https://www.udemy.com/git-a-web-developer-job-mastering-the-modern-workflow/?couponCode=YOUTUBEDEAL
HTML & CSS Course: https://www.udemy.com/web-design-for-beginners-real-world-coding-in-html-css/?couponCode=YOUTUBEDEAL
WordPress for Beginners Course: https://www.udemy.com/wordpress-for-beginners-create-a-website-blog-step-by-step/?couponCode=YOUTUBEDEAL

One of my favorite hobbies is mispronouncing babel.

Follow me on Twitter for updates and cat pics:
https://twitter.com/learnwebcode
JavaScript Template Literals: JSON to HTML

Follow along link: https://codepen.io/learnwebcode/pen/qVLOZJ
Finished product: https://codepen.io/learnwebcode/pen/eyZMyp
New WordPress Course: https://www.udemy.com/become-a-wordpress-developer-php-javascript/?couponCode=YOUTUBEDEAL
Git a Web Developer Job Course: https://www.udemy.com/git-a-web-developer-job-mastering-the-modern-workflow/?couponCode=YOUTUBEDEAL
HTML & CSS Course: https://www.udemy.com/web-design-for-beginners-real-world-coding-in-html-css/?couponCode=YOUTUBEDEAL
WordPress for Beginners Course: https://www.udemy.com/wordpress-for-beginners-create-a-website-blog-step-by-step/?couponCode=YOUTUBEDEAL

Follow me on Twitter for updates and cat pics:
https://twitter.com/learnwebcode
WordPress REST API Tutorial (Real Examples)

My new advanced WordPress course: https://www.udemy.com/become-a-wordpress-developer-php-javascript/?couponCode=YOUTUBEDEAL
My front-end course: https://www.udemy.com/git-a-web-developer-job-mastering-the-modern-workflow/?couponCode=YOUTUBEDEAL

Let's learn about the new WordPress REST API.

Link to my website: http://learnwebcode.com/

Starter AJAX Code: http://codepen.io/anon/pen/ObBQqv?editors=0010

Starter Form HTML & CSS: http://codepen.io/anon/pen/jVQPLz?editors=1100

Link to download zip of finished theme files: http://learnwebcode.com/wordpress-rest-api-tutorial-real-examples/

Add me on Twitter for webDev resources and cat pics: https://twitter.com/learnwebcode
WordPress Pagination Tutorial (Custom Query & Template Integration)

My new advanced WordPress course: https://www.udemy.com/become-a-wordpress-developer-php-javascript/?couponCode=YOUTUBEDEAL
My front-end course: https://www.udemy.com/git-a-web-developer-job-mastering-the-modern-workflow/?couponCode=YOUTUBEDEAL

Let's learn the basics of pagination and how to paginate our own custom queries.

Link to my website: http://learnwebcode.com/

Link to source code for theme files we worked on in this video: http://learnwebcode.com/wordpress-pagination-tutorial-with-custom-queries/

Add me on Twitter for webDev resources and cat pics: https://twitter.com/learnwebcode
Handlebars.js Tutorial (webpack integration at the end)

Since the filming of this lesson webpack has changed their API so don't type out the exact webpack code you see on my screen. Instead, my GitHub link below has the newest code changes that will work. NOTE: in my updated version you do NOT need the dollar sign $ before the helper name in your templates.

My front-end course: https://www.udemy.com/git-a-web-developer-job-mastering-the-modern-workflow/?couponCode=YOUTUBEDEAL
My new advanced WordPress course: https://www.udemy.com/become-a-wordpress-developer-php-javascript/?couponCode=YOUTUBEDEAL

"Follow along" code: http://codepen.io/anon/pen/qqPegg

"Finished product" code: http://codepen.io/anon/pen/WoddJb?editors=1010

Webpack Handlebars Example Repo: https://github.com/LearnWebCode/handlebars-webpack

Add me on Twitter for webDev updates and cat pics: https://twitter.com/learnwebcode
SVG Tutorial: With CSS Animation

My front-end course: https://www.udemy.com/git-a-web-developer-job-mastering-the-modern-workflow/?couponCode=YOUTUBEDEAL
My new advanced WordPress course: https://www.udemy.com/become-a-wordpress-developer-php-javascript/?couponCode=YOUTUBEDEAL

What is a vector graphic and how can we animate one? Learn by following along with this video.

Link to cat drawing SVG: http://codepen.io/anon/pen/YppjQq

Add me on Twitter for webDev updates and cat pics: https://twitter.com/learnwebcode
Git Tutorial Part 4: GitHub (Pushing to a Server)

If you already know Git, don't worry, a brand new "Vector Art & Animation" video will be up next Tuesday. Link to full course with coupon: https://www.udemy.com/git-a-web-developer-job-mastering-the-modern-workflow/?couponCode=YOUTUBE-HALF-OFF

Add me on Twitter for webDev updates and cat pics: https://twitter.com/learnwebcode
JSON and AJAX Tutorial: With Real Examples

My front-end course: https://www.udemy.com/git-a-web-developer-job-mastering-the-modern-workflow/?couponCode=YOUTUBEDEAL
My new advanced WordPress course: https://www.udemy.com/become-a-wordpress-developer-php-javascript/?couponCode=YOUTUBEDEAL

In this JavaScript tutorial we learn what JSON and AJAX are and how to use them to load new data into our webpage on-the-fly.

JSON URLs I use in the video:
https://learnwebcode.github.io/json-example/animals-1.json
https://learnwebcode.github.io/json-example/animals-2.json
https://learnwebcode.github.io/json-example/animals-3.json

Link to "beginning" demo code so you can follow along: http://codepen.io/anon/pen/QKPJmW

Link to "completed" demo code so you can see a final working example: http://codepen.io/anon/pen/RGOqQY

Link to my "JavaScript in Half an Hour" video I mentioned: https://www.youtube.com/watch?v=zPHerhks2Vg

Add me on Twitter for webDev updates and cat pics: https://twitter.com/learnwebcode
Git Tutorial Part 3: Installation, Command-line & Clone

If you already know Git, don't worry, a brand new "JSON & AJAX" video will be up tomorrow. Link to full course with coupon: https://www.udemy.com/git-a-web-developer-job-mastering-the-modern-workflow/?couponCode=YOUTUBE-HALF-OFF

Add me on Twitter for webDev updates and cat pics: https://twitter.com/learnwebcode
Git Tutorial Part 2: Vocab (Repo, Staging, Commit, Push, Pull)

Part 3 will be posted this weekend. If you already know Git, don't worry, a brand new "JSON & AJAX" video will be up next Tuesday. Link to full course with coupon: https://www.udemy.com/git-a-web-developer-job-mastering-the-modern-workflow/?couponCode=YOUTUBE-HALF-OFF

Add me on Twitter for webDev updates and cat pics: https://twitter.com/learnwebcode
Git Tutorial Part 1: What is Version Control?

Part 2 will be posted Thursday. If you already know Git, don't worry, a brand new "JSON & AJAX" video will be up next Tuesday. Link to full course with coupon: https://www.udemy.com/git-a-web-developer-job-mastering-the-modern-workflow/?couponCode=YOUTUBE-HALF-OFF

Add me on Twitter for webDev updates and cat pics: https://twitter.com/learnwebcode

Become a WordPress Developer: Unlocking Power with Code

Visual Studio Code: HTML, CSS & JS Tips

JavaScript Template Literals: JSON to HTML

WordPress REST API Tutorial (Real Examples)

WordPress Pagination Tutorial (Custom Query & Template Integration)

Handlebars.js Tutorial (webpack integration at the end)

SVG Tutorial: With CSS Animation

Git Tutorial Part 4: GitHub (Pushing to a Server)

JSON and AJAX Tutorial: With Real Examples

Git Tutorial Part 3: Installation, Command-line & Clone

Git Tutorial Part 2: Vocab (Repo, Staging, Commit, Push, Pull)

Git Tutorial Part 1: What is Version Control?