Web Development
-
1:15:02
Ionic 3 Mobile Weather App Build
Added 99 Views / 0 LikesIn this project we will build a fully working mobile weather app using Ionic 3 and Angular 4. We will be using the API from wunderground.com. we will create a provider to reach out to the API and return and display the data. We will also implement Ionic storage to save the location data. CODE: Code for this project https://github.com/bradtraversy/iweather SPONSORS: DevMountain Bootcamp - https://goo.gl/6q0dEa ANGULAR 4 FRONT TO BACK: FOR $10! https://
-
22:38 Popular
Easy Fullscreen Landing Page With HTML & CSS
Added 113 Views / 0 LikesIn this small project I will show you how to create a simple HTML/CSS landing page with a fullscreen image in the background. We will also use a little bit of flexbox styling. CODE: Code for this project https://codepen.io/bradtraversy/pen/XerXYV SPONSORS: DevMountain Bootcamp - https://goo.gl/6q0dEa BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TIME DONATIONS: http://www.paypal.me/traversymedia FOLLOW TRAVERSY ME
-
14:04 Popular
Build a Sails.js App [Part 1] - Sails & API Setup
Added 101 Views / 0 LikesIn this 4-part mini-series we will put together a CRUD application using the Sails.js MVC framework along with MongoDB as our database. We will also build the UI using Bootstrap 4 Beta. In this video we will setup Sails and the api for articles. CODE: Code for this project https://github.com/bradtraversy/articlebase BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TIME DONATIONS: http://www.paypal.me/traversymedia FO
-
12:51 Popular
Build a Sails.js App [Part 2] - MongoDB Adapter & Homepage
Added 113 Views / 0 LikesIn part 2 of 4 we will implement the sails-mongo MongoDB adapter and build our homepage view using EJS CODE: Code for this project https://github.com/bradtraversy/articlebase BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TIME DONATIONS: http://www.paypal.me/traversymedia FOLLOW TRAVERSY MEDIA: http://www.facebook.com/traversymedia http://www.twitter.com/traversymedia http://www.instagram.com/traversymedia
-
12:58 Popular
Build a Sails.js App [Part 3] - Article List & Add Pages
Added 138 Views / 0 LikesIn part 3 of 4 we will create the article list page to list articles in a table. We will also create the form to add articles to MongoDB CODE: Code for this project https://github.com/bradtraversy/articlebase BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TIME DONATIONS: http://www.paypal.me/traversymedia FOLLOW TRAVERSY MEDIA: http://www.facebook.com/traversymedia http://www.twitter.com/traversymedia http://www.in
-
10:23
Build a Sails.js App [Part 4] - Edit & Delete Articles
Added 96 Views / 0 LikesIn part 4 of 4 we will finish up CRUD functionality with the edit and delete methods. CODE: Code for this project https://github.com/bradtraversy/articlebase BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TIME DONATIONS: http://www.paypal.me/traversymedia FOLLOW TRAVERSY MEDIA: http://www.facebook.com/traversymedia http://www.twitter.com/traversymedia http://www.instagram.com/traversymedia
-
29:42 Popular
Mobile First Responsive Contact Form Featuring Grid CSS
Added 139 Views / 0 LikesIn this tutorial we will be building a responsive mobile first contact form using HTML and CSS. We will use CSS3 styling along with a bit of Grid CSS layout. Well also throw in some icons from font awesome and a simple entry animation using animate.css. This will be the front-end UI. We will implement the back end to capture the data in a later video. PART 2 - IMPLEMENTING FIREBASE! https://www.youtube.com/watch?v=PP4Tr0l08NE CODE: Code for this proje
-
26:08 Popular
Connecting Firebase to a Contact Form
Added 125 Views / 0 LikesIn this video we will take the responsive contact form we built in the last video and hook it up to a firebase backend to store submissions in a firebase database. VIDEO TO CREATE FORM FRONT-END: https://www.youtube.com/watch?v=Sb5qOa3R4hY INITIAL CODE: Form frontend http://www.traversymedia.com/downloads/responsiveform.zip FINAL CODE: With firebase https://github.com/bradtraversy/firebasecontact BECOME A PATRON: Show support & get perks! http://www.p
-
38:27
Sass Workflow & Dev Server From Scratch Using Gulp
Added 89 Views / 0 LikesIn this video we are going to build the "Sass Starter Pack" which is a complete Sass workflow and dev server and environment using Gulp, the Gulp-Sass plugin and BrowserSync. Then well mess with it a little bit and create a simple little project. Feel free to use this starter pack in future Sass projects SASS STARTER PACK GITHUB: https://github.com/bradtraversy/sass_starter_pack CHECK OUT THE NEW DISCORD SERVER:https://discord.gg/PCb6PaM BECOME A PATR
-
53:04 Popular
Build A Bootstrap 4 Theme | Latest Beta Version
Added 143 Views / 0 LikesThis is a full Bootstrap 4 Beta project which is a theme called LoopLab. This is from my premium Udemy course. It uses many of the new version 4 classes and utilities including flexbox. FULL COURSE: ONLY $10! https://www.udemy.com/bootstrap-4-from-scratch-with-5-projects/?couponCode=YOU_TUBE BOOTSTRAP 4 STARTER PACK: https://github.com/bradtraversy/bs4starter PROJECT FILES: http://www.traversymedia.com/downloads/looplab.zip BECOME A PATRON: Show suppo
-
44:39 Popular
Build a Useful Wordpress Widget Plugin
Added 107 Views / 0 LikesIn this video we will build a Wordpress widget plugin for displaying a YouTube channel subscriber button. It will have backend options to change the channel, the layout and the option to show the subscriber count. CODE: Code for this widget https://github.com/bradtraversy/youtubesubs BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TIME DONATIONS: http://www.paypal.me/traversymedia FOLLOW TRAVERSY MEDIA: http://www.f
-
1:09:43 Popular
AJAX Crash Course (Vanilla JavaScript)
Added 111 Views / 0 LikesIn this video we will dive into AJAX with Vanilla JS and NO JQUERY. We will examine the XHR object and how it works. This is a beginner friendly tutorial for anyone that has very basic JavaScript knowledge. We will make xhr requests to a txt file, local json files, an external API and even PHP files. CODE: Files for this course http://www.traversymedia.com/downloads/ajaxcrash.zip BECOME A PATRON: Show support & get perks! http://www.patreon.com/traver
-
30:54 Popular
Fetch API Introduction
Added 127 Views / 0 LikesIn this video we are going to take a look at the fetch API for making requests and fetching resources. This is an introductory based tutorial. We will create a fetch API sandbox to get data from local resources as well as a remote API CODE: Code for this video http://www.traversymedia.com/downloads/fetchsandbox.zip BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TIME DONATIONS: http://www.paypal.me/traversymedia COU
-
24:07 Popular
LoopBack REST API with Authentication
Added 129 Views / 0 LikesIn this video we will explore the LoopBackJS API framework for Node.js. We will create a REST API with user authentication endpoints. We will be installing the MongoDB connector as well. OFFICIAL SITE & DOCS: https://loopback.io/ COMMANDS: http://www.traversymedia.com/downloads/loopbackcommands.txt BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TIME DONATIONS: http://www.paypal.me/traversymedia FOLLOW TRAVERSY MEDI
-
31:27
Create a Modal With HTML, CSS & JavaScript
Added 88 Views / 0 LikesIn this video we will be creating a modal from scratch using HTML, CSS and JavaScript. You see these a lot with frameworks like Bootstrap but here we will create our own custom modal. CODE: Code for this video https://codepen.io/bradtraversy/pen/zEOrPp BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TIME DONATIONS: http://www.paypal.me/traversymedia FOLLOW TRAVERSY MEDIA: http://www.traversymedia.com http://www.face
-
29:31
Intro to Anime.js - The JavaScript Animation Engine
Added 83 Views / 0 LikesIn this video we are going to look at the Anime.js JavaScript animation engine to create a simple app with some element animation that we can play/pause CODE: Code for this video https://github.com/bradtraversy/animiesample DOCS: https://github.com/juliangarnier/anime BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TIME DONATIONS: http://www.paypal.me/traversymedia COURSES & MORE INFO: http://www.traversymedia.com F
-
29:54 Popular
Nodemailer - Send Emails From Your Node.js App
Added 121 Views / 0 LikesIn this video we will create a simple Node.js and Express app and implement the Nodemailer module to add a contact form. CODE: Complete Node app repo https://github.com/bradtraversy/nodecontactform ORIGINAL HTML/CSS FORM DOWNLOAD: http://www.traversymedia.com/downloads/responsiveform.zip INMOTION HOSTING SIGNUP: https://inmotion-hosting.evyy.net/c/396530/260033/4222 BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TI
-
33:56 Popular
Awesome Split Screen Slider Using CSS3 & JavaScript
Added 103 Views / 0 LikesIn this video we will build a split screen slider using HTML, CSS3 and vanilla JavaScript. This slider was inspired by a Corsair website - http://www.corsair.com/en-eu/specalpha. It uses some advanced CSS but nothing too difficult, beginners should be able to follow along CODE: Codepen for this project https://codepen.io/bradtraversy/pen/NaKxdP BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TIME DONATIONS: http://w
-
39:01 Popular
JavaScript DOM Crash Course - Part 1
Added 109 Views / 0 LikesThis crash course focuses on the DOM WITHOUT JQUERY. In this part we will talk about what the JavaScript DOM (Document Object Model) is and we will look at the different selectors like document.getElementById() document.getElementsByClassName() document.getElementsByTagName() document.querySelector() document.querySelectorAll() We will also look at how to change content and styles via these selectors CODE: Code for this video http://www.traversymedia.
-
21:21 Popular
JavaScript DOM Crash Course - Part 2
Added 104 Views / 0 LikesIn this video we will learn how to traverse and move around the DOM with properties like parentNode, parentElement, nextElementSibling and so on. We will also learn how to insert elements with createElement() and createTextNode() CODE: Code for this video http://www.traversymedia.com/downloads/domcrashcourse2.zip BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TIME DONATIONS: http://www.paypal.me/traversymedia COURS
-
33:45 Popular
JavaScript DOM Crash Course - Part 3
Added 106 Views / 0 LikesIn this lesson in the JavaScript DOM, we will be looking at different events and how to attach them to DOM elements with addEventListener(); CODE: Code for this video http://www.traversymedia.com/downloads/domcrashcourse3.zip BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TIME DONATIONS: http://www.paypal.me/traversymedia COURSES & MORE INFO: http://www.traversymedia.com FOLLOW TRAVERSY MEDIA: http://www.facebook.c
-
22:08 Popular
JavaScript DOM Crash Course - Part 4 [Final Project]
Added 104 Views / 0 LikesIn this video we will take what we learned in the last 3 videos and create a simple Item lister project where we can add list items with a form, delete them and filter through them all with vanilla JavaScript and DOM properties and methods. CODE: Codepen for this project https://codepen.io/bradtraversy/pen/Bwapow BECOME A PATRON: Show support & get perks! http://www.patreon.com/traversymedia ONE TIME DONATIONS: http://www.paypal.me/traversymedia COURS
-
21:36 Popular
Build A Codeigniter PHP App - Part 8
Added 134 Views / 0 LikesIn this video we will add pagination to the blog posts and create access control for the categories by adding a user_id field to the categories table CODE: Code for this series https://github.com/bradtraversy/ciblog EDUONIX COURSES: Please use affiliate links from website below http://www.traversymedia.com/eduonix-courses SUPPORT: We spend massive amounts of time creating these free videos, please donate to show your support: http://www.patreon.com/tr
-
14:32
Top 5 JavaScript Frameworks 2017
Added 85 Views / 0 LikesThis is MY top 5 front end JavaScript Frameworks of 2017. This list took many things into factor such as ease of use, popularity, features, syntax, performance and more #5 - Polymer #4 - Ember #3 - Angular 2+ #2 - React #1 - Vue.js Comparison Article - http://www.valuecoders.com/blog/technology-and-apps/vue-js-comparison-angular-react/ SPONSORS: DevMountain Bootcamp - https://goo.gl/6q0dEa EDUONIX COURSES: Please use affiliate links from website below
-
14:42
Basic cURL Tutorial
Added 81 Views / 0 LikesIn this video we will cover the basics of cURL which is a tool/command for transferring data and making requests. cURL is a tool that every web developer should know at least the basics of. CODE: Snippets from this video http://traversymedia.com/downloads/curl-tutorial.txt EDUONIX COURSES: Please use affiliate links from website below http://www.traversymedia.com/eduonix-courses SUPPORT: We spend massive amounts of time creating these free videos, ple
-
41:08
Facebook Login & Graph API | JavaScript SDK
Added 90 Views / 0 LikesIn this freestyle coding video I will implement Facebook login using the JavaScript SDK and we will take a look at the Graph API. We will also be working with the Graph API explorer and taking a look at the different permissions that we can request with the access token CODE: Code for this video https://github.com/bradtraversy/socialauth Graph API Explorer: https://developers.facebook.com/tools/explorer/ Register Facebook App: https://developers.faceb
-
26:55
Less CSS Pre-Processor Tutorial
Added 58 Views / 0 LikesIn this video we will look at all of the basics and fundamentals of the Less CSS pre-processor/pre-compiler. Less gives you powerful features to take advantage of such as variables, mixins, functions, nesting and much more We will install less and less-watch-compile using NPM so you do need Node.js installed on your system CODE: Code for this video http://www.traversymedia.com/downloads/less_sandbox.zip LESS Website http://lesscss.org/ EDUONIX COURSES
-
47:11 Popular
Build a Full Featured Ecommerce Website With Opencart
Added 123 Views / 0 LikesIn this video we will create a full featured Ecommerce shopping cart website using OpenCart which is an open source PHP platform. ANYONE can follow along as we will not even be writing any code. We will be deploying the site to a live server using InMotion hosting. A full demo is available at the link below Full Demo: Admin is disabled http://djoutlet.codedemos.com/ CODE: Including Images http://traversymedia.com/downloads/djoutlet_opencart.zip InMoti
-
30:27
Katana PHP Static Site & Blog Generator
Added 89 Views / 0 LikesIn this video we are going to explore the Katana PHP static website generator. This is a tool that can be installed via Composer and uses Laravels blade templating system to generate static assets from dynamic content. CODE: Code for this video http://traversymedia.com/downloads/katanasite.zip DEMO: http://codedemos.com/katanasite EDUONIX COURSES: Please use affiliate links from website below http://www.traversymedia.com/eduonix-courses SUPPORT: We sp
-
12:21 Popular
What's New In Bootstrap 4?
Added 109 Views / 0 LikesBefore I create the new Bootstrap 4 crash course I want to go over some of the changes from Bootstrap 3. In this presentation we will talk about things like Bootstrap 4 using Sass over Less Improved Grid System The Use of Flexbox Design Changes Navbar ES6 For JavaScript Plugins And Much More... 9 HOUR BOOTSTRAP 4 COURSE W/5 PROJECTS - JUST $10: https://www.udemy.com/bootstrap-4-from-scratch-with-5-projects/?couponCode=YOU_TUBE POWERPOINT DOWNLAOD: htt









