Posted on

Learn JavaScript Episode #7: If/else Statements

In the 7th episode of this JavaScript tutorial series, we will cover if/else statements. I will demonstrate the basic syntax, a few practical examples, and why you should avoid “Yoda code.”

Get The Learn to Code Course Bundle!
https://josephdelgadillo.com/product/learn-to-code-course-bundle/

Get The Complete Front-End Web Development Course!
https://www.udemy.com/front-end-web-development/?couponCode=WORDPRESS

Best,
Joseph Delgadillo
Web: https://josephdelgadillo.com/
YouTube: https://www.youtube.com/c/JosephDelgadillo
Steemit: https://steemit.com/@jo3potato

Posted on

Learn JavaScript Episode #6: Comparing Values

In the 6th episode of this JavaScript tutorial series we will go over how to compare values. We will cover the operators required to check equal to, greater than, less than, etc., and a few practical applications for web development.

Get The Learn to Code Course Bundle!
https://josephdelgadillo.com/product/learn-to-code-course-bundle/

Get The Complete Front-End Web Development Course!
https://www.udemy.com/front-end-web-development/?couponCode=WORDPRESS

Best,
Joseph Delgadillo
Web: https://josephdelgadillo.com/
YouTube: https://www.youtube.com/c/JosephDelgadillo
Steemit: https://steemit.com/@jo3potato

Posted on

Learn JavaScript Episode #5: Boolean Operators

In the 5th episode of this JavaScript tutorial series we will cover boolean operators. Booleans are used to compare whether two statements are true or false. In JavaScript, one equals sign is used for assignments, and two equal signs are used for comparisons.

Get The Learn to Code Course Bundle!
https://josephdelgadillo.com/product/learn-to-code-course-bundle/

Get The Complete Front-End Web Development Course!
https://www.udemy.com/front-end-web-development/?couponCode=WORDPRESS

Best,
Joseph Delgadillo
Web: https://josephdelgadillo.com/
YouTube: https://www.youtube.com/c/JosephDelgadillo
Steemit: https://steemit.com/@jo3potato

Posted on

Learn JavaScript Episode #4: Modifying and Undefined Variables

In the 4th episode of this JavaScript tutorial series for beginners we will cover modifying and undefined variables. It is important to reuse existing variables and other objects whenever possible to avoid excessive RAM usage.

Get The Learn to Code Course Bundle!
https://josephdelgadillo.com/product/learn-to-code-course-bundle/

Get The Complete Front-End Web Development Course!
https://www.udemy.com/front-end-web-development/?couponCode=WORDPRESS

Best,
Joseph Delgadillo
Web: https://josephdelgadillo.com/
YouTube: https://www.youtube.com/c/JosephDelgadillo
Steemit: https://steemit.com/@jo3potato

Posted on

Learn JavaScript Episode #3: Integers, Strings, and Variables

We are going to continue with this complete JavaScript tutorial by covering basic data types. In this video video I will show you how to use strings, integers, and variables in JavaScript.

Get The Learn to Code Course Bundle!
https://josephdelgadillo.com/product/learn-to-code-course-bundle/

Get The Complete Front-End Web Development Course!
https://www.udemy.com/front-end-web-development/?couponCode=WORDPRESS

Best,
Joseph Delgadillo
Web: https://josephdelgadillo.com/
YouTube: https://www.youtube.com/c/JosephDelgadillo
Steemit: https://steemit.com/@jo3potato

Posted on 1 Comment

Learn JavaScript Episode #2: Comments, Alerts, and Console Logging

Get The Learn to Code Course Bundle!
https://josephdelgadillo.com/product/learn-to-code-course-bundle/

Get The Complete Front-End Web Development Course!
https://www.udemy.com/front-end-web-development/?couponCode=WORDPRESS

In this JavaScript tutorial we will continue with the basics and cover how to insert comments in your code, as well as two builtin functions. We will be using alerts and console logging quite a bit throughout this tutorial.

Best,
Joseph Delgadillo
Web: https://josephdelgadillo.com/
YouTube: https://www.youtube.com/c/JosephDelgadillo
Steemit: https://steemit.com/@jo3potato

Posted on

Learn JavaScript Episode #1: Introduction

Get The Learn to Code Course Bundle!
https://josephdelgadillo.com/product/learn-to-code-course-bundle/

Get The Complete Front-End Web Development Course!
https://www.udemy.com/front-end-web-development/?couponCode=WORDPRESS

JavaScript is an extremely valuable scripting language that allows you to create functions, classes, event handlers, etc. within a website. In this tutorial video, we will cover how to create JavaScript files in your web project, inline js, and your first program!

Best,
Joseph Delgadillo
Web: https://josephdelgadillo.com/
YouTube: https://www.youtube.com/c/JosephDelgadillo
Steemit: https://steemit.com/@jo3potato

Posted on 4 Comments

Complete JavaScript Tutorial for Beginners

Get The Complete Front-End Web Development Course on Udemy!
http://bit.ly/2y2Nee7

Check out the Learn to Code Course Bundle!
https://josephdelgadillo.com/product/learn-to-code-course-bundle/

If you want get started as a front-end web developer, you will LOVE this complete JavaScript tutorial! JavaScript powers the majority of websites/webapps, so it is an essential language to know for any aspiring web developer.

If you would like to watch the videos with English subtitles, you can find them in the following playlist on YouTube 🙂

Topics covered in the video:

  • Introduction to JavaScript
  • Alerts and console logging
  • Integers, strings, and variables
  • Undefined variables and modifying variable values
  • Boolean operators
  • Comparing values
  • If statements
  • For loops
  • Defining functions
  • Event handling
  • Setting an elements inner HTML
  • Arrays pt.1
  • Arrays pt.2
  • Arrays pt.3
  • Textareas and getting the values of inputs
  • Functions – parameters and return values
  • Multiple function parameters
  • Flexible function parameters
  • Find the missing number exercise
  • Exercise solution
  • Classes intro
  • Class constructor, instance variables, and static variables
  • Extending classes
Posted on 2 Comments

Enroll in The Ultimate Web Development Course!

Hello Everyone!

Nick and I are pleased to announce the release of our newest course on front-end web development!

If you would like to get started as a front-end web developer, you are going to LOVE this course! Work on projects ranging from a simple HTML page to a complete JavaScript based Google Chrome extension.

https://www.udemy.com/front-end-web-development/?couponCode=WORDPRESS

We will cover the following technologies in this course:

  • Web development basics with HTML
  • Cascading Style Sheets (CSS)
  • JavaScript programming
  • jQuery JavaScript library
  • Bootstrap framework

This course covers the most popular web development frameworks, and will get you started on your path towards becoming a full-stack web developer!

This course is also available as an individual product on the site, and as a part of The Learn How to Code Course Bundle!

https://josephdelgadillo.com/product/learn-to-code-course-bundle/

https://josephdelgadillo.com/product/web-development/

Thank you for taking the time to read this, and we hope to see you in the course!

Posted on 1 Comment

Xamarin GUI Walk-through

Let’s talk about where we find things in our Xamarin Studio. The first thing I’m gonna to talk about is this bar right at the top here. So this white bar which may look familiar to users of Mac, because you have it in iTunes and the App store and things, it’s a bar that tells you where your errors are located and various messages. So, if I double click it, it’s not happening right now. But when you have an error it will show up here at the top and if you double click it, it will take you to the error, and that’s very useful. On the right hand side of the bar, this arrow if I click it, it tells me there’s an update for Xamarin. At the moment, I’m not going to update but just know that occasionally you might have to update to a beta channel or in extreme cases an alpha channel. Now this is because sometimes there are errors in Xamarin and it doesn’t quite compile right in a way that either Android or iOS accepts. So, might have to update to the latest beta, or alpha, just remember that. Ok, If we look at the left hand side of the screen we have this big play button, and the play button allows us to run whatever currently selected project we have in a device or simulator. The two ways of running it are either in debug mode or release, and the difference between the two is debug is where we want to be as developers because debug allows us to receive messages from the device when things go wrong. Release mode will not send us messages, so we won’t be able to see if something goes wrong all we see is the app crash on the phone. In the next box, when we click it down, I’ve got various iOS simulators set up here, and you can go into Xcode and set up more iOS simulators but these are the standard ones that Xcode should install for you. If you plug in an iPhone it will show up here in the iOS devices list, and you can run it on your iPhone or iPod or iPad. I don’t think you can run it in your trial edition of Xamarin though, but correct me if I’m wrong. Just below this panel, we have the solution, which I went through before with you in the previous lecture. I didn’t address UI tests because we are not going to look at that in this tutorial course. You can look it up on Xamarin’s website, but at the moment it’s not really within the realm of our project. The large window in the middle here is where we do the majority of our work. So if I come over here to NoteTaker.iOS and I go to AppDelegate.cs and I double click it, it will open the middle here and show me a whole bunch of code, and of course I can type things in here. Here you’ll notice the first feature of Xamarin, and that’s if I have a piece of code that’s wrong that it disagrees with it will put a red line underneath it. That tells me that there’s an error and that will be something I have to fix. So, I’m just going to delete that will save it back and if we look over here on the right hand side, we have a properties panel and this properties panel is related to this file we’ve just opened. So you can change the build action compile resource, image resource and generally you won’t have to look at this side panel except in extreme situations when you add things to your project. For example, in the resources images folder it will automatically set it as an image asset for you. So, there’s no need to worry about that kind of thing. So, we’re just gonna close that, and I’m going to close AppDelegate. Right, so if we look down the side here, I’m just gonna take you into another part of the GUI, which is a graphical editor, here we have Main.storyboard. So if you double click that, that’s gonna open up, and it usually takes a little while to get going, but it’s a graphical editor that allows you to place various elements on the screen in iOS. You do not have this sort of graphical editor in the Android version of Xamarin. They have a different way of doing things, and we will cover that when we get to Android. Once that’s loading if you come over here, we have a section called toolbox on the right. In Toolbox we have a whole bunch of things that we can add to our graphical user interface. I’m not going to go with what they are, but they are all here. To put them into our app, we simply have to click and hold and drag them across and there they are and to delete them, select this grey bar at the bottom, and press Command+Backspace and that will get rid of it. At the top of the main screen, you can click to see what it will look like on various devices. So on iPhone 6 it will look like this. On a iPhone 6 Plus it will look like this. The items that are already laid it there for you, you can tap them once and if you come over to properties, you have three tabs, Widget, Layout, and events. Ignore Events because we will do that ourselves. Widget lets you setup your item that you have on screen, so I can give it a name, a class, if we scroll down, you can give it an alignment relative to the screen, there are many things we can do, Layout, tells it exactly where it should be in the screen, and you can align it, to the center of the whole screen, both vertically and horizontally. Now, for this course, I am not going to do this tutorial, I’m not going to use storyboards, at all. We’re going to do everything programmatically, and the reason we are going to do everything programmatically is for your learning experience. So in the future if you want to use a different platform, that’s not Xamarin, that might be PhoneGap or Intel SDK, whatever it’s called now. So for this course, we’re not going to use storyboards. If we come to the top we have our menu, and if we click on the first one Xamarin Studio we can check for updates, see what version we have, and change our preferences, etc. If you click on preferences, we find the screen that allows you to set various settings through out the app through out Xamarin, rather. The most important of which is this one down here, SDK locations and Xamarin needs to know where these are for both Apple and Android. The Apple one will search the default location. So, when you install Xcode this is what it searches for, and it will also search for Xamarin.iOS which is installed with Xamarin Studio if you just install it the default way. Android, 2it needs to find three things the Android SDK, The Java SDK, and the Android NDK. These are usually located in the standard folders. If you can’t find them, if you come into here and there are red X’s go unto the Xamarin website or unto the forums and request help from them because they will take you through it. That pretty much covers, what we need to talk about with the GUI, and that brings me on to section 3, where we are going to plan our app before writing any code. So I look forward to seeing you then.