I recently wrote a script that generates a text-based ASCII folder structure based on a bullet list. This was something that I had looked for before while I was writing documentation, but I couldn’t find it so I thought that I’d write it myself. Because a picture is worth a thousand words, here is what the final product looks like:
The program takes a list of strings with hashes to represent folder depth, and then returns an ASCII folder tree. …
Have you written this line of code recently?
const url = 'http://example.com/movies';
.then(response => response.json())
.then(data => console.log(data));
Chances are if you are a professional web developer at any stage of your career then yes, you write API calls like this all the time. For a simple example like the above, where the URL is 100% static, you can get away with using a simple string to define your URL. But when does that ever happen in real life 😄? …
Generates the following output:
To make the list dynamic you are able to use JS to fetch content from an endpoint like so:
The advantage of using…
It’s a quiet Saturday evening, I’m relaxing in my Shanghai flat with my roomate. The pollution is bad outside today, so neither of us is planning to leave the house for a while. We’ve made some stir fried veggies and are talking about real estate in the living room.
A knock on the door. My rooomate looks at me. I shrug, telling him implicitly I also am not expecting anyone.
I walk over and open the door. There’s a 45 year old woman in the doorway. She’s looking at me in amazement when I respond to her in Chinese. She…
The Intersection observer API allows you to determine when and how much of an element is visible inside another element. This new API replaces the scroll handler API in many cases. The top use cases for the intersection observer are:
I’ve been taking some time to revisit my knowledge of the basic web technologies, especially HTML and Accessibility. A lot of the time what separates a junior from a senior developer is not their knowledge of advanced patterns, but actually their knowledge of these natively supported APIs.
Once you know how much you can do with HTML, you are able to write lighter and more fully-featured websites with more backward compatibility.
One of those browser-supported features is the
<picture> element, supported in all modern browsers. …
For most web developers, a large part of your job will be building pages that interact with and respond to, APIs that are located on a remote server. The more you know about the HTTP protocol, the better you will be able to utilize these API interfaces.
HTTP Headers are key value pairs that let the client (your web application) pass additional information back to the server, and accept the same type of date from the server. …
As a web developer you have a responsibility to write semantic HTML that will make your web page effective at conveying information not only to users like you, but also users very much not like you — robots, screen readers, SEO crawlers looking for structured data to build search rich results, humans with varying levels of disability, and many others.
The first thing is to understand, philosophically, what the imagined separation of concerns is between HTML, CSS, and JS, the building blocks of the web.
JS is for interaction/behavior and management of state (besides some very basic state that may…
SEO stands for search engine optimization. Simply put, it is:
The process of making your website easy for search engines to find and read your website
It should be one of the primary considerations for every modern application developer, and if you are developing a website professionally, taking SEO into consideration while building your website can make a huge difference to your companies bottom line 🤑.
There are a few primary categories of optimizations that will allow you to excel in SEO. At some point I would like to delve deeper into each of these topics, but for in this…