DEV Community: Shrijan

Laravel Installation for Macbook. (Without docker)

Shrijan — Fri, 14 May 2021 11:13:57 +0000

Prerequisite: homebrew

Disclaimer: This article is for the streamlined installation of laravel command-line tools with PHP and MySQL on MacBook. You can follow the installation and starting guide on laravel.com, I personally like the installation with sail. But this is the traditional way of using laravel on Macbook.

Installation

PHP installation

we will need to install PHP with homebrew, with command

brew install php

This command will install the latest version of php.

If you have PHP installed already then simply update php

brew update php

MySql Installation

The command is simple enough like

brew install mysql

once installation completed you can start mysql with brew services

brew services start mysql

once mysql is running on your machine you can login to the mysql with

mysql -u root -p

and enter your password by default it will blank string.

now you can use all of the commands for mysql.

Installation of the composer.

For installing composer goto https://getcomposer.org/download/

and paste the following code found on the installation document.

php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"
php -r "if (hash_file('sha384', 'composer-setup.php') === '756890a4488ce9024fc62c56153228907f1545c228516cbf63f885e036d37e9a59d27d63f46af1d4d07ee0f76181c7d3') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;"
php composer-setup.php
php -r "unlink('composer-setup.php');"

If you try to use the composer command it will not be found and the composer.phar file is not executable. Follow the following command to make it executable and move it to the local bin folder.

$ chmod +x composer.phar
$ mv composer.phar /usr/local/bin/composer

Now try using composer

composer

You must be able to see available commands for the composer listed.

Laravel installer

Install laravel with composer globally

composer global require laravel/installer

Now try using laravel, the command will not found because composer is not been set on the zsh (our terminal)

For zsh

echo 'export PATH="$HOME/.composer/vendor/bin:$PATH"' >>  ~/.zshrc
source ~/.zshrc

If you are bash then use

echo 'export PATH="$HOME/.composer/vendor/bin:$PATH"' >> ~/.bashrc
source ~/.bashrc

Now you have successfully installed the laravel command line tool. Now you can create laravel application with

laravel new example-app

Now you can start creating your awesome application with laravel.

cd example-app
php artisan serve

Happy Coding....

Docker and its basic commands

Shrijan — Thu, 30 Apr 2020 15:12:47 +0000

What is docker?

Docker is a tool designed to make it easier to create, deploy, and run applications by using containers. (by- opensource.com)

What is a docker container?

A container is a standard unit of software that packages up code and all its dependencies so the application runs quickly and reliably from one computing environment to another.

What is a docker image?

A Docker image is a lightweight, standalone, executable package of software that includes everything needed to run an application: code, runtime, system tools, system libraries, and settings.

A Docker image is a file, comprised of multiple layers, that is used to execute code in a Docker container. When the Docker user runs an image, it can become one or multiple instances of that container.

Basic Docker commands

Here, we will look at some of the basic commands for developers.

Docker Images

# List available images in the local registry
docker images

# Get image history 
docker image history <image-name/id>

# Get all details about the images
docker image inspect <image_name/id>

# Remove image from the local registry
# We can use an alias like rm or rmi as well
docker image remove <image-name/id>

# Remove all unused images
docker image prune

# Pull an image or a repository from a registry
docker image pull <image/repository>

# Push an image to a registry
docker image push <repository-name:tag>

Docker container

# All running containers
docker container ls

# All containers
docker container ls -a

# Stop the running container 
docker container stop <container-id>

# Pause the running container
docker container pause <container-id>

# Unpause the running container
docker container unpause <container-id>

# Kill the docker container
docker container kill <container-id>

# Inspect the container 
docker container inspect <container-id>

# Remove the unused container
docker container prune 

# Remove one or more container
docker container rm <container-id>

Let's try running
docker run -p 5000:5000 learntechfree/simple-express-app:0.0.1.RELEASE

What we just wrote is the shortcut for docker container command
docker container run -p 5000:5000 learntechfree/simple-express-app:0.0.1.RELEASE

On pausing the container, that will not receive any request and that might cause the timeout if we try to access that docker container. In Linux, that will send the SIGSTOP signal.

Moreover, the difference between the STOP and KILL is, STOP allows us to close the container gracefully and KILL not. Internally STOP executes the command SIGTERM and if needed SIGKILL and KILL directly execute SIGKILL.

Docker System

Docker system basically has four basic commands:

# Shows the docker disk usage
docker system df

# Get real-time events from the server
docker system events

# Display system-wide information
docker system info

# Remove unused data, images, containers, networks, and build caches.
# Will be useful when you want to remove all unused things
docker system prune

Docker Stat


# Display resource usage statistics
docker stats <container-id>

# or
docker container stats <container-id>

This command is used to view the CPU usage, memory usage, memory limit of the container.

We can explicitly set the limit for memory usage for that container with parameter -m.

Check the following command where we have provided 512Mib of memory limit for the container.

docker container run -p 5000:5000 -d -m 512m learntechfree/simple-express-app:0.0.1.RELEASE

Now, if we do docker stats <container-id> then you will get the limit for that container to 512mb only not the default 2GB.

We can also say how much percentage of CPU we want to assign to our container or say how much part of CPU we want to provide to the container with cpu-quota parameter.

The total CPU quota is of 100,000 or says a hundred thousand so that if we want to provide half of it then we have to provide --cpu-quota=50000

Try,
docker container run -p 5000:5000 -d -m 512m --cpu-quota=50000 wordpress

As only half of the CPU is available it might take a bit more time for a startup and process.

Next: Creating our own docker image and deploy to docker hub

Creating and deploying your first Dockerized web application

Shrijan — Wed, 29 Apr 2020 16:38:05 +0000

PART-1: Creating a simple web application with NodeJs and express.

For creating a simple node application we will be using express, a simple light weighted framework for NodeJs.

Create a folder on your project folder

mkdir simple-express-app

Create NPM repository

npm init -y

This should create a package.json file in your root directory. The file must look like

{
  "name": "simple-express-app",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

we can edit this file for adding description, author, keywords for the project. You can edit whatever you want to edit though.

Add express dependency

npm i express

This will pull the express package from the NPM registry, make node_modules if not available and add in dependencies key of package.json.

Create `index.js` file with express.

The file might look like

"use strict";

const express = require("express");

const PORT = 5000;
const HOST = "0.0.0.0";

const app = express();
app.get("/", (req, res) => {
  res.json({ message: `Hello from simple-express-app` });
});

app.listen(PORT, HOST);
console.log(`Running on http://${HOST}:${PORT}`);

No need to worry if you are unaware of node application, we will be looking in detail below:

Create an express application.

const app = express()

Create route for root get request and send the json response.

app.get("/", (req, res) => {
  res.json({ message: `Hell from simple-express-app` });
});

Listen to port and host

app.listen(PORT, HOST);
console.log(`Running on http://${HOST}:${PORT}`);

Run the project

Now we can run the express application simply with node index.js but make sure you have installed your node dependencies if that is missing run npm install.

Verify if your project is running.

Go to your browser and check the url and we should get the JSON output for the message.

.
.
.
.
.
.
.
.
.

PART-2, Dockerizing the project

For dockerizing the project we need to create Dockerfile. Let's create Dockerfile in your root.

The Docker file will look like

FROM node:10-alpine
WORKDIR /app
COPY . /app 
RUN npm install
EXPOSE 5000
CMD node index.js

Don't get afraid of the code herewith. We are going to discuss each part of it.

The first line will define from what image we want to start building, here we are getting node of version 10 with alpine which is the light Linux distribution.

FROM node:10-alpine

Next line will create a directory to hold the application code inside your image, this will be the working directory for your application:

WORKDIR /app

The third step will copy your application code with the current directory to /app which is the working directory for our image.

COPY . /app

The fourth step will run the command for installing dependency we will have in our node application.

RUN npm install

The next one will bind your app to port 5000 or whatever you have exposed herewith. We will use EXPOSE instruction to have it mapped by docker daemon.

EXPOSE 5000

The last but not least, we will define the command to run our application using CMD. Here we will be using node index.js for starting our server.

CMD node index.js

Now we are ready to dockerize our project, let's build our first docker image.

docker build -t <your-username>/simple-express-app .

Note that period sign (.) at the last of the docker build command that tells docker-daemon to build with files with the current directory.

The -t flag lets us put a tag for our image so it will be easier to find and use with the docker images command.

The user name is the docker-hub username, which will be used to push the images to the docker hub.

Now find your image with docker images command and you will get similar output. Make sure the new docker image is created with the tag we have provided for our first docker image.

$ docker images

# Example
REPOSITORY                         TAG        ID              CREATED
node-alpine                        10         1934b0b038d1    5 days ago
<your username>/simple-express-app    latest     d64d3505b0d2    1 minute ago

Run the image

docker run -p 5000:5000 -d <your-username>/simple-express-app

Here -p stands for publishing or expose the port 5000. This binds the port 5000 of the container where our express app will run with the 5000 port of the host machine.

The -d tag will run the container in detached more or run the container in the background.

List and test if docker container is running

# list the running container and get the id
docker ps

# get logs for application
docker logs <container_id>

# test in the browser or 
curl -i localhost:5000

# If you want to stop the running container 
docker stop <container_id>

Publish

Now let's publish our first docker image to docker hub. There are very simple steps to publish

# Login to docker hub
# however -p via CLI is not secure we can use 
# cat ~/my_password.txt | docker login --username foo --password-stdin
docker login -u <user-name> -p <password>


# Push to docker hub
# here 0.0.1.RELEASE is the release version
# Don't forget to replace learntechfree with your username

docker push learntechfree/simple-express-app:0.0.1.RELEASE 

# Now visit the docker hub and check repository we will get the currently pushed images in your repository.

What's Next: Improving Layer Caching (Article coming soon).

Reference: Documentation

JavaScript Object Getter and Setter

Shrijan — Sat, 04 Apr 2020 21:00:49 +0000

JavaScript object may have multiple properties and methods to deal with static data along with dynamic calculation. There are many ways to achieve these functionality and we are going to explore some of them here.

Using Object Literals (Old School way and most popular)

const student ={
  _name:'Ram',
  getName:function(){
    return this._name;
  },
  setName:function(nameParam){
    this._name = nameParam
  }
}

const name = student.getName();
console.log(name); // should return =>  Ram

Now lets set the name and get later with the same example.

const student ={
  _name:'shrijan',
  getName:function(){
    return this._name;
  },
  setName:function(nameParam){
    this._name = nameParam
  }
}

student.setName('Shyam');

const name = student.getName();
console.log(name); // should return => Shyam

There is no doubt that we can simply can get with student._name as well, we are considering that we are not exposing properties publicly. Please help me finding use cases below in comment whether we don't have to expose properties like in above.

Using `get` and `set` syntax

According to MDN get and set syntax binds an object property to a function that will be called when that property is looked up.

Sometimes we want to access the property with dynamically calculated value without implementing explicit method calls. Where getter and setter comes in play.

Let us take the same example of student


const student = {

  _firstName : 'Ram',
  _lastName : 'Shrestha',

  get fullName(){
    return `${this._firstName} ${this._lastName}`;
  }
}

console.log(student.fullName); // should return 'Ram Shrestha'

Whats new here ?

get keyword is used to define or bind fullName
accessing fullName as property not as the function.

You might be thinking what if we want to set the first name and last name with providing full name. Yes, your guess is correct we will be using set keyword to set property. Lets expand the example :

const student = {

  _firstName : 'Ram',
  _lastName : 'Shrestha',

  get fullName(){
    return `${this._firstName} ${this._lastName}`;
  },

  set fullName(fullName){
    const splittedNames = fullName.split(' ');
    const [_first, _second] = splittedNames;
    this._firstName = _first;
    this._lastName = _second;
  }
}

console.log(student.fullName); // should return 'Ram Shrestha'

student.fullName = "Shyam Sundar";

console.log(student.fullName); // should return 'Shyam Sundar'

Again What's new here ?

set keyword to define setter
accessing with fullName property to set data not function.

Wait, why are we doing so much calculating for simply setting up first name and last name why not fullName(firstName, lastName) at a same time? I was thinking same but

Remember: get can not have any parameter and set can have only one.

Using Object.defineProtpery method

According to MDN : The static method Object.defineProperty() defines a new property directly on an object, or modifies an existing property on an object, and returns the object.

lets try to achieve same functionality with following example.

const student = {
  _firstName: "Ram",
  _lastName: "Shrestha",
};
Object.defineProperty(student, "fullName", {
  get: function () {
    return `${this._firstName} ${this._lastName}`;
  },
  set: function (fullName) {
    const splittedNames = fullName.split(" ");
    const [_first, _second] = splittedNames;
    this._firstName = _first;
    this._lastName = _second;
  },
});

console.log(student.fullName); // should return 'Ram Shrestha'

student.fullName = "Shyam Sundar";

console.log(student.fullName); // should return 'Shyam Shrestha'

Thank you :)