Hi everyone! Welcome back to part 2 of The Ultimate Beginner’s Guide to GraphQL tutorial series. Before we start, if you haven’t seen part 1, you might want to check it out here. This tutorial will build off the concepts learned in part 1. With all that said, I wanted to go more in depth about something I only briefly mentioned in part 1: the GraphQL infrastructure. This is an important part of learning how GraphQL works, and what makes it so awesome. The GraphQL Infrastructure To get a better understanding of the advantages and disadvantages of GraphQL, I created this handy little infographic ..read more

Let’s talk about one of the biggest pains in web development: connecting your app to a database. While you might not share the same opinions, this is one of my least favorite parts of server-side development, so this tutorial will show you my tried-and-true tricks for making this go smoothly. Firstly, when you’re just starting with databases, it can be very overwhelming as there are TONS of different options to choose from. Should you choose plain-old MySQL, MongoDB, PostgreSQL, or maybe GraphQL? If you’re thinking, “What’s the big difference?” Then don’t worry, you’re not alone; I originally ..read more

Welcome back everybody! This is the second part of my Svelte Tutorial: The Comprehensive Guide series. If you haven’t seen the first part, I would recommend checking it out as this tutorial will build off the concepts learned in the first part. As the title loudly exclaims, we’re going to be discussing logic, reactivity, and DOM events today in the awesome Javascript framework Svelte. As a quick recap, we learned about the following concepts in the first part of the tutorial: What Svelte is Svelte installation Svelte Components Nesting Components Shorthand Attributes Props Spread Props If yo ..read more

Hey everybody! Meet Svelte. Svelte is another awesome Javascript framework, a little bit like React, that I’ll be going over in this tutorial today. What is Svelte? At this point, you’re probably wondering what exactly Svelte is. Well, here’s the short answer: Svelte is a Javascript Framework for building fast web applications. So what does this mean? Svelte is basically designed to give your application speed, which makes it similar to React and Vue. But there is one critical difference: Svelte turns your app into real Javascript at build time, as opposed to converting the code during run tim ..read more

When it comes to making POST requests, you have a wide variety of options, however I’m only going to go over 2 options. Option 1: Axios The first option is probably the easiest option, and it’s an NPM package called Axios. To start using Axios, navigate to your project directory in your computer’s terminal and install it locally with NPM. npm i axios -S Next, the Axios syntax is below: axios .post('<your-url-here>', {<your-data-here>}) .then(res => { console.log(res); }) .catch(error => { console.log(error); }); Option 2: HTTP Option 2 is slightly longer ..read more

A common thing you might see in a developer’s code is something called string interpolation, and it’s super useful. In short, it’s an easy way to add two variables together in a string. For example, without interpolation, your code might look like this: var x = 'Hello'; var y = 'World'; var message = x + ' ' + y; In the above snippet, we have two variables. Then, we add the variables together in a string. However, there’s an easier way to do this. Check out the following code: var x = 'Hello'; var y = 'World'; var message = `${x} ${y}`; As you can see, we first form a string. It is importa ..read more

Since arrow functions were introduced in ES6, they have become increasingly popular, changing the look and function of regular functions. I love arrow functions; I use them all the time. In fact, they have grown so popular that you rarely see the function keyword anymore, though I can assure you it is still used. I almost always use arrow functions in place of the function keyword. This is a short guide about Javascript arrow functions. What They Look Like Before arrow functions, you probably declared a function in 1 or 2 ways. Like this: function myFunction() {} Or like this: var myFunctio ..read more

For me, finding just the right programming project has always been a challenge. It has to be difficult, but not too difficult. Fun, but not too long or ambitious. And I needed projects that would improve my skills, not just build off of existing knowledge. Well, your search for javascript projects ends here! Here is a list of the best 30 javascript projects that I think are worth completing for both beginner and experienced programmers. Beginner Projects Make a Javascript Tic-tac-toe game Make a Javascript Clock Make a Javascript Tip Calculator Make a Javascript Calculator Make a Javascript To ..read more

GitHub is a great tool to be used when programming, as it helps store your code over the internet. It makes your project more organized, easier to develop, and allows you to collaborate with friends or other developers. In addition, GitHub works smashingly with Visual Studio Code. If you’re still not recognizing a need for GitHub, do not worry – you will soon. In this short tutorial, I’m going to show you how to connect your project with GitHub from the command line. Connecting to GitHub First, navigate to your project in your computer’s terminal and run: git init That will initialize your p ..read more

Occasionally, you might want to program waits or repetitive actions into your Javascript pages. This could be useful if you’re animating, waiting for a task to execute, or if you’re creating a stopwatch or timer. Regardless of what you’re programming though, you will likely be using the setTimeout() or setInterval() methods. The setTimeout() Method The first method we’re going to be talking about is the setTimeout() method. The setTimeout() method creates a pause in your program for a specified amount of time, and then executes a specified function. The syntax looks like this: setTimeout(func ..read more