Categories
Resources Web Development

Single page apps suck links and resources

Single page apps built with Javascript are the super hyped rage these days. This design goes against all of the hard learned lessons of the past 30 years.

The main reason SPA’s suck is networks are unreliable and SPA require large amounts of Javascript to be transferred to a users device. Most devices are mobile these days. If a users has a slow connection the app will take for ever to load or timeout and not load at all.

Another reason SPA’s suck is they assume all users are using the latest greatest highest powered device. This leaves out more than half the planet and is a very arrogant approach basically saying you are not important to us because you are poor and have a crappy device and slow connection go elsewhere you peasant.

I’ll post links here as I get time. The first one is an excellent piece covering much of why SPA’s are not a good choice.

Why you should not build your start-up as Single-Page Application?

Categories
Resources Web Development

How to install and update NVM node version manager on Ubuntu

New to node and need to install npm, node.js? Use NVM node version manager so you can install more than one version of nodejs.

I had to look for the answer to this until I found it. You update to a newer version of NVM node version manager the same way you install it regardless of how you install it.  I am not sure what happens if you install nvm with curl then try to update it in another way.

For example I used the following in my terminal as not the root user, just a plain user
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash

 

When I want to install the next version  I replace the v0.35.3 with the next version and it does all the work.  If you installed nvm as a root user then you will not be able to access it easily as any other user.

In fact, if you type nvm –version in the command line as a regular user after you installed it as a root user, you will be told it is not installed, or nvm is not a recognized command would you like to install.   I did this, so that is how I learned not to install it as a root user.

Never ever, ever, not ever use sudo when installing node, npm, nvm or anything like yarn it totally fucks every last thing up.

If you accidentally use sudo follow these instructions to fix the bowl of mashed spaghetti you end up with.

The node world feels as disorganized as Scala here is a link to the latest version

If you are using windows you can install nvm by following these instructions

More info and resources about nvm here.

More info and resources about node package manager

Categories
Resources Software Development Web Development

node version manager nvm resources

Articles

Getting started with nodejs, nvm, npm

Videos

How to Install Node Version Manager on Ubuntu

Categories
Resources Web Development

Webpack resources, links and videos

Frontend development has become a challenge. These days we need all kinds of tools. Instead of having one large Javascript file or one large CSS file, you need to develop modularly and therefore you need to break up your files into many smaller files. This leads to all kinds of issues, especially with javascript since the order that your javascript is loaded can mean errors or not. “path”: __dirname+’/static’,
“filename”: “[name].[chunkhash:8].js”

javascript pro tip
javascript pro tip meme

I have used many tricks in the past such as creating my own BASH scripts which collected the files from folders and checked the order and trans-piled and minified them to single files. Even that process got to be a pain because it is hard to make sure things are loa “path”: __dirname+’/static’,
“filename”: “[name].[chunkhash:8].js”ded in the right order.

Webpack makes it easier

Instead of explaining webpack in a lot of paragraphs, I will create a list of videos and articles  I find helpful. First off what is Webpack? I found this video to be very helpful.
“path”: __dirname+’/static’,
“filename”: “[name].[chunkhash:8].js”

 


Customize Bootstrap 4 with Webpack | Webpack tutorials


Webpack 4 Tutorial – Getting Started for Beginners


Learn Webpack – Full Tutorial for Beginners


 

Resources, Articles & links

A Beginner’s Guide to Webpack 4 – A great article to get started with.

An introduction to source maps – An article about using source maps in javascript

Webpack using Source Maps – Webpack documentation page for source maps

Webpack source map devtool – Webpack documentation for the devtool that creates source maps, this lists the options

Webpack SourceMapDevToolPlugin – documentation, this plugin aids the source map devtool to add more features and options.

A mostly complete guide to webpack (2020) – a great article about webpack

Creating a custom webpack plugin – decent article about the basics of creating a webpack plugin

Categories
Resources Web Development

React information and resources

Why you shouldn’t use inline styling in production React apps

Why you should use refs sparingly in production

Do React Hooks Replace Redux?

Videos

Learn REACT JS in just 5 MINUTES (2020)


JavaScript for React Developers | Mosh

Categories
Resources Web Development

Redux information and resources

Why use redux, reasons with clear examples

Logrocket it helps you find bugs in your redux apps

What Is Redux: A Designer’s Guide

Do you need redux with react hooks?


Videos

What is Redux?

Categories
Resources Web Development

Javascript resources

javascriptweekly – keep up to date on the latest javascript news

How to deal with dirty side effects in your pure functional JavaScript

async/await is just the do-notation of the Promise monad

Do we really need classes in JavaScript after all?

The cost of javascript. Javascript is often misused and abused or poor practices are used. This article covers some of the things you can do to lighten your apps javascript load and clean up your code a little.

Should You Use Classes in JavaScript?

A re-introduction to JavaScript (JS tutorial)  – because developers couldn’t be bothered with the hard task of learning actual Javascript syntax we had to pollute the syntax even more with Classes etc.

Function expressions explained

Arrow function expressions explained – examples and explanation

Mocking is a code smell – interesting article about how you can get https://krasimirtsonev.com/blog/article/javascript-managing-events-dispatch-listenout of control with testing and dependency injection. It is about javascript but applies to other languages.

Eradicating memory leaks in Javascript – A very good article for anyone to who creates Apps with Javascript.

Javascript managing events

Javascript let vs var vs const – a good article explaining the differences.

Categories
Resources Web Development

Web Development resources

Media queries you should know about

Browser support for Javascript API’s – This is a very useful table to see what is supported at the moment

Link to ecmascript feature tables to look up what you can use in Javascript in current browsers.

Transaction patterns for web applications – interesting article with good information.

Must-Have Social Meta Tags for Twitter, Google, Facebook, & More 

opendyslexic Font for dyslexic people or anyone in general a good font.

andika nice clear fonts for clean looking text that is easy to read

What You Need to Know About Open Graph Meta Tags for Total Facebook and Twitter Mastery– Very good introduction to the topic, not a long read.

List of all mime types