We are going to discuss CSS Selectors and how to select an element and style it!
They are simply selectors that can grab one or more elements from the HTML file. Every good looking webpage is because of CSS so it’s vital to understand how to select HTML elements! Probably!
The type selector is the most basic selector for styling elements. In our CSS, we can grab all elements of a type or element name. So if we want to style all <h1> elements, our css rule would look like this:
The class selector…. you guessed it, selects all elements with the specific class. If we give each div element in our HTML file a classname of
class="section" and want to select each “section”, we prepend a period to the class when selecting the element. …
First, let’s go over a Tree data structure.
A tree is a widely used abstract data type that simulates a hierarchical tree structure, with a root value and subtrees of children with a parent node, represented as a set of linked nodes. -Wikipedia, Tree (data structure)
We have a root node with children nodes, each of which can have their own children nodes. In a Binary Search Tree, every element can have AT MOST 2 children (Binary) and as we are inserting nodes, we are sorting. …
Let’s get started!
First, let’s make sure we have a html file and we can add our Canvas element to it! We will also create a main.js file and link it to our HTML as well. Our HTML file should look something like this:
Here we have a HTML file with just a Canvas element inside the body. If you open this file in the browser, you will see a blank page but the Canvas is there! …
Let’s talk about the three necessary technologies you need to build a beautiful and interactive website! We will talk about each core technology and gradually build a small website!
HTML is the backbone for websites, it’s short for HyperTextMarkupLanguage. HTML structures your page, you can think of a Word Document without any style. You have a title, a heading, a body with some paragraphs and maybe even a footer! This is exactly what HTML is for a page. Lets look at an example, create a new folder with a index.html …
Classes are just blueprints for objects. This may not make sense quite yet, but let me give you an example! You buy an Ikea desk and it comes with instructions on how to assemble the desk. The instructions are like the blueprint, the desk you eventually put together, is an object, or in this case called an instance of the blueprint.
Classes are used to make a blueprint for instances also known as objects. We can have a class Person and create new instances (people) from that class. Let’s get setup, create a .js …
In this article we are going to set up a small server using nothing but NodeJS and it’s built in modules. Now, normally we would immediately install ExpressJS or another web framework to help get our server up and running but thats not fun. Right?
Before we get to far, lets create a directory called NODE_SERVER and a couple files inside this directory so we can have something to reference:
/. Add the following HTML to this file.
Theres actually a pretty “simple” explanation of why these comparisons are false! It turns out the variables, like array1, holds a reference/pointer (memory address) for that array. So what is really being stored in the array1 variable is the physical address, in memory, where that array lives. It’s the same with objects! When you declare a variable and give it the value of an array or an object, what you are actually doing is saying, “I would like this variable to keep a reference to the array( or object) I am about to create”. …
Let’s start with the forEach method shall we! The forEach method allows us to iterate over each item in the array. You can see that we passed an arrow function in as the argument to forEach. The method will call that function and pass in the element as its argument. Inside our arrow function, we can do whatever we need to with each element, here we are simply logging each number to the console. …
If you get into Web development, Software Development or anything to do with writing code, you well eventually come across something called Big O Notation. It won’t make much sense in the beginning of your journey but when you start learning algorithms, applying for jobs or preparing for interviews, you’re going to need some knowledge of Big O.
Simply put, Big O is used to help us estimate the Run-time Complexity of a function and how it scales when the input increases. Meaning that if we give a function an Array with 10 items vs giving that same function an Array of 10,000 items, we want to understand the performance of that function with regards to input. When we see O(n), we are saying “Order of N”, where N is the input count. …
In this article we are going to cover sending an Image using Fetch, storing that image in Rails Active Storage and retrieving that image when a user visits your site.
So you have your Rails API running and your React front end running. I will assume you can make new users through a signup form if not we will quickly run through that as well!
After running create-react-app and starting the server you should see the nice React starter page! Lets make a User Signup Component!
Hopefully you are familiar with the above image and whats going on so far! In our onSubmit function we will make a Post to our /users route. …