Software Dev Weekly Update #3: Class Constructors, Node.js, & Modules

realnerdethan

Ethan Goddard

Posted on August 11, 2021

Software Dev Weekly Update #3: Class Constructors, Node.js, & Modules

This past week was a whirlwind of learning!

I completed sections #29, #30, #31, then started #32. We wrapped up Class Constructor Functions, covered the setup of GitBash and Node.js, reviewed commonly used terminal/shell commands, created files/directories, learned how to 'export' and 'require' JS files, and more!

Class Constructor Function
The 'Extend' and 'Super' keywords demonstrate inheritance between functions by allowing us to remove duplicate code in many different functions and share it from one super function ('extend').

Using 'super' allows us to use part of the super function inside another constructor function when defining new properties.

//Pet is a Super class
class Pet {
    constructor(name, age){
        this.name = name;
        this.age = age;
    }
    eat(){
        return `${this.name} is eating!`
    }
}

class Cat extends Pet {
    constructor(name, age, livesLeft = 9){
        //Super allows us to call the constructor in the Super Function called Pet
        super(name, age)
        this.livesLeft = livesLeft;
    }
    meow(){
        return 'MEOWWW!!'
    }
}

class Dog extends Pet {
    bark(){
        return 'WOOOF!!'
    }
    //Dog having it's own Eat method means it will not look for Eat in the Pet function becuase it already found one in the Dog function
    eat(){
        return `${this.name} scarfs their food!`
    }
}
Enter fullscreen mode Exit fullscreen mode

Quick Demo of a Color Converter Constructor Function
Color Converter Demo

My First Brush With Node.js
Node.js is written with JavaScript but is a beast of its own. We learned that it can be used for all sorts of projects ranging from web servers to game development, its even used with Astronauts Spacesuits by NASA!

For the purposes of learning web development we focused on using Node.js as a console to execute JavaScript files we've written. For example, we wrote a program that creates a 'Project' folder and populates it with our boilerplate files (index.html, app.js, styles.css).

//File System Module in Node.js example
//https://nodejs.org/dist/latest-v14.x/docs/api/fs.html

//This is required for fs to work
const fs = require('fs');
// console.log(fs);

//This remove the executable file path and the file path to the new folder/file
const folderName = process.argv[2] || 'Project'

//ASync version of making a directory
// fs.mkdir('ASyncTest', { recursive: true }, (err) => {
//     console.log('In the callback!')
//     if(err) throw err;
//   });

//Sync version of making a directory
//fs.mkdirSync('SyncTest');

//console.log('I come after the mkdir in the file!')

//This is an example of how to create a directory and files within it. Also wrapped in a try/catch to catch any errors
try{
    fs.mkdirSync(folderName);
    fs.writeFileSync(`${folderName}/index.html`, '');
    fs.writeFileSync(`${folderName}/app.js`, '');
    fs.writeFileSync(`${folderName}/styles.css`, '');
} catch(error){
    console.log('Ope! An error was encountered:', error);
}
Enter fullscreen mode Exit fullscreen mode

Exploring Modules and the NPM Universe
In this section we're reviewing the concept of 'export' and using index.js with 'require' to access data from one file inside another.

This lesson is still in progress but it's building to a better understanding of Modules and their key part in modern web apps.

The learning journey continues...

studying setup with computer and book
It's been a fantastic week and I'm very excited to be starting the 'backend' part of the course. Being able to deploy what I've written is the missing piece to the puzzle that I've never been able to solve but I feel it's within reach. It keeps me motivated to push on and I can't wait to share what I've learned next week!


I hope you enjoyed the read!

Feel free to follow me on GitHub, LinkedIn and DEV for more!

💖 💪 🙅 🚩
realnerdethan
Ethan Goddard

Posted on August 11, 2021

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Javascript callbacks
javascript Javascript callbacks

December 14, 2023

What is an API? (Beginners guide)
javascript What is an API? (Beginners guide)

January 6, 2023