Posts

Es6 new features summarized round up

Escmascript es2017 or better known as es16 is the edition after the famously popular es15, In this edition there are only two new additional features the exponention operator and Array.prototype.includes() functionexponention operator** Operator is a short hand method used for raising numbers to their powerIts syntax is similar to native operators such as '+' Addition and '-' (minus) for subtractionExample usage
Initially to raise a number to the power you would need to use math library pow function as;Math.pow({number}, {factor})Since es2017 you can simplify the operation above down to simply as;{number} ** {factor}Example as;5 ** 2
// Giving you 25Array.prototype.includes()Array includes is a feature similar to a pre existing function array.indexof() as compared to array.indexof() array.includes() function notably returns a true  boolean on matched value, and false if value not matchedExamples on how to use 'array.includes()' functionThe first argument is the…

unused css rules tree shaking elimination nodejs

Unused css rules elimination process is a lot more like tree shaking done by JavaScript bundlers for instance if you're familiar with how webpack eliminates dead code as a result tree shaking generates a much smaller bundle with only essential codePurifycss is a nodejs npm open source package that eliminates unused css
You can use purifycss to remove excess css from libraries such as bootstrap, materal design lite to name a few,InstallationYou can get "purify-css" npm package from the package manager by typing in your terminal;npm i purify-cssTo install globally add -g flag;npm i -g purify-cssBasic example usage;
You can use css purify global cli package as;Syntax;purifycss {css} {html}Important flags;-m minify output
-o specify output file nameFor example;purifycss *.css *.html -o css.min.cssOutput containg minified css rules will get saved to css.min.css

what is 'array.includes' function in JavaScript

Array includes is a feature introduced in JavaScript es16 or es2017 it's similar to a pre existing function array.indexof() as compared to array.indexof() array.includes() function notably returns a true  boolean on matched value, and false if value not matchedExamples on how to use 'array.includes()' functionThe first argument is the value to be looked upon in an array;const arr = ['dogs', 'cats', 'snakes']arr.includes('liars')
// falsearr.includes('snakes')
// truearr.includes('lizards')
// falseI hope you get the concept

'**' exponential operator in JavaScript

** Operator in an es6 Escmascript feature a short hand method used for raising numbers to their powerIts syntax is similar to native operators such as '+' Addition and '-' (minus) for subtractionExample ussage
Initially to raise a number to the power you would need to use math library pow function as;Math.pow({number}, {factor})Since es2017 you can simplify the operation above down to simply as;{number} ** {factor}Example as;5 ** 2
// Giving you 25

How to make a Snake Game using JavaScript and html5

Image
I compiled stapes to create a game similar to Nokia developed, popular game called 'snake'

Snake was first developed by Nokia, programmed in 1997 by Taneli Armanto and published on Nokia mobile devices,  It was introduced on Nokia model 6110, 3310 from 2000 and later the game was rebranded as "Snake Xenzia" Included on later mobile phone models

I made a version that is more simplified and more beginners friendly, It's based on the same idea of making a snake that grows as it eats stuff and the score increases as it grows

I'm implementing this whole game in pure vanilla JavaScript and a taste of html5 canvas, In this project the canvas is used as a renderer for the game's visual output

conceptsandinitialideas

I got the idea while doing another retro gaming project, i thought it would be good too if i created this game, from start my plan had been simplicity and making this game easy to implement, So to simplify everything i had a great deal of planning pr…

How to create zip archives in nodejs

I'm going to compile ways in which you can create archives compressed using zip algorithm in nodejs or a similar JavaScript runtime.node-zip is an open source zip archiving utility authord by daraosn and folked from jszip capable of compresding files into a zip archive and extracting zip archives in JavaScript.node-zip is available on npm you can install it in your terminal window by typing;npm install node-zip example usageconst  zip = new require('node-zip')()
zip.file('test.file', 'John Swana')const data = zip.generate({base64:false,compression:'DEFLATE'})
console.log(data)How to unzip a ziparchiveconst zip = new require('node-zip')(data, {base64: false, checkCRC32: true})
console.log(zip.files['test.file'])

Basic commands to open, zip and unzip archives

zip  is  a compression and file packaging utility for Linux, Unix OS, MAC and MS zip utility comes handy with another companion program called unzip, unzip is used to list, test and extract zip archivesBasicusage;zip basicusage;Zip command line program can be used to compress files as;zip -{flags} {package} {item}Example on how tozipafileusingzipYou can zip and compress a file as;zip pack.zip filename.mp3Zip will get the command to package filename.mp3 and store it in an archive named pack.zipHowtocompress a directorywith zipDirectories can be archived using the -r flagYou can zip and compress a directory as;zip -r bundle.zip directoryHowtounzipfilesusingunzipunzip a companion program to zip is used to extract archives typed unzip followed by archive name to extract a package as;unzip  {filename}for example;unzip pack.zip

Tar basic commands to store and extract files

Targeted is an archiving program designed to package, store, and compress multiple files into a single portable package the name tar is an abbreviation for tape archiverApart from creating .tar archives tar is also capable of compressing files using zip, bzip2, and gzip compression algorithmsTar flagsc — compress directive
x — extract directive
t — tabulate contents
f — specify filename
z — use zip/gzip compressionj — use bzip2 compression
k — do not overwrite
t — files from file
w — ask for configuration
v — verbosegzip flagsd — decompress fileTar commandline commands syntaxtar -{arguments} {params}Example tar commandstar -cf music.tar music.mp3Tar archiver will be directed to compress music.mp3 into a tar archive named music.tar and save it in the current working directorytar -xf music.tarTar will be directed to extract music.tar archive and save the constituent contents of the archive in the current working directoryhowtomake a zip archivesusingtarTar can compress zip files as well…

How to install tfjs JavaScript library

Image
Tensorflow is a hardware accelerated JavaScript library for building, training, testing and deploying machine learning models on a JavaScript runtime environment.
Installation through html script tag For use within the browser you can link to jsdelivr content delivery network using an html script tag as follows;
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.0.0/dist/tf.min.js"></script>
Installation through npm package manager Alternatively you can install a self hosted version of tensorflow from npm, in your terminal type;
npm install '@tensorflow/tfjs'
Installation for tfjs-node on npm tensorflow has two nodejs packages made specifically for nodejs
Installation for '@tensorflow/tfjs-node' This version is a cpu only version it doesn't utilize gpu to do the computing, install tfjs node by typing;
npm install '@tensorflow/tfjs-node'
Installation for '@tensorflow/tfjs-node-gpu' This version is arguably faster than the …

String repeat in JavaScript

String repeat is a function that can be used to multiply a string for a given number of times, its a feature that is closely related to string multiplication operator in Python programming language, as compared to Python's syntax;
("String") * (number of times to repeat) "A" * 3
// returns "AAA"
Something similar may be archived using string repeat function in JavaScript as;
("String").repeat(number Of times to repeat)
For example to triple "A" you can do as;
"A".repeat(3)
Practical example is with lyrics;
const part = "i feel you, "
const lyrics = part.repeat(4) + " A, B, C" // "i feel you, i feel you, i feel you, i feel you, A, B, C"
Further reading;
String.prototype.repeat() MDN