Forem: Abhishek S. Sharma

Dockerize Angular App

Abhishek S. Sharma — Sat, 08 Jan 2022 15:27:11 +0000

Agenda

Dockerize an Angular app, built with the Angular CLI, using Docker, In this blog we will have a walkthrough of angular 7 and dockerize it over node image(base).

Here, we specifically focus on:

Create an angular app using CLI and test it locally
Create an image for dev environment with code Hot-reloading

Project Setup

Install the Angular CLI globally:

npm install -g @angular/cli@7.3.10

Generate a new app aka “angular-microservice” using CLI:

ng new angular-microservice 
cd angular-microservice

(optional)To generate in present dir use:

ng new angular-microservice –directory ./

Docker Setup

Add a Dockerfile to the project root:

# base image
FROM node:12.2.0

# set working directory
WORKDIR /app
# install and cache app dependencies
COPY package.json /app/package.json
RUN npm install
RUN npm install -g @angular/cli@7.3.10

# add app
COPY . /app

# start app
CMD ng serve --host 0.0.0.0

Building Docker image

docker build -t angular-microservice:dev .

Run Docker Image

Run the container after the build is done:

docker run -d -v ${PWD}:/app -v /app/node_modules -p 4201:4200 --rm angular-microservice:dev

Use the -d flag to run the container in the background:

docker run -d -v ${PWD}:/app -v /app/node_modules -p 4201:4200 --name foo --rm angular-microservice:dev

Please react if you found this blog helpful and informational.

Linux - I am Love with Terminal

Abhishek S. Sharma — Sat, 22 Aug 2020 13:51:44 +0000

Forget your bird, Love Linux

Click on playground and roll on your sleeves :c) -

playground

There are four types of the shell, we have in Linux-

Broune Shell -Sh shell
C Shell - csh or tcsh
Z shell -zsh
My Favorite - Bourne again shell -bash
To check shell type-

echo #SHELL
To print on the terminal

echo Hi from terminal !!
To view the current directory, display absolute path, means path from the root

pwd
To view all the files in a directory, -a will display hidden files as well

ls
ls -a
To change directory, it is case-sensitive, and you have to type in the name of the folder exactly as it is.

cd .. - To go back from a folder to the folder before that
cd my_directory - to goto my_directory folder
When folder name has space e.g. my bird

cd my\ bird
Create a new directory

mkdir abhishek
When folder name has a space e.g. abhishek sharma

mkdir abhishek\ sharma
make directory hierarchy from one command

mkdir -p /dir_1/dir_2/dir_3/dir_4
Run multiple commands in a single line

cd abhishek\ sharma; mkdir devops_tools; ls
Create a file

touch file_1.txt
Write content in the file

cat > file_1.txt
write anything, write- "this is my first file in Linux" and type Ctrl+d to save
another way to do it

echo "this is my first file in linux" > file_1.txt
View content

cat file_1.txt
Remove directory and file commands

mkdir removable_dir
rmdir removable_dir
mkdir removable_dir
cd removable_dir; touch removable_file.txt
rmdir removable_dir
---it gives you an error
Notes: only blank directories can be deleted with rmdir; to delete a directory, which has content in it, we will use rm -r

rm -r removable_dir
To delete a file

rm file_1.txt
Copy commands-
Copy a file to another file

cp {options} source_file target_file
cp new_file.txt copy_file.txt
Copy File(s) to another directory or folder

cp {options} source_file target_directory
touch /dir_1/dir_2/file_4.txt
cp -v /dir_1/dir_2/file_4.txt /dir_1/dir_2/dir_3/dir_4
Copy directory to directory

cp {options} source_directory target_directory
To copy a directory from one place to another use -r or -R option in cp command

cp -r /dir_1/dir_2/dir_3/dir_4 /dir_1/dir_2/
If the destination directory already has the same file, still you want to copy that file, to overwrite it use *-i*

cat > dir_1/dir_2/file_4.txt - this is me. press ctrl+d
cp -i /dir_1/dir_2/file_4.txt /dir_1/dir_2/dir_3/dir_4
Move command- mv command to move the files one place to another

touch dir_1/dir_2/file_3.txt
mv -v dir_1/dir_2/file_3.txt dir_1/dir_2/dir_3
Rename filename

touch latest.txt
want to change this file name latest to new

mv latest.txt new.txt
rm latest.txt
Search something

locate new.txt
if you want to ignore the case

locate -i New.txt
if you want a file that has the word "this"

locate -i this
If you want the file(s) that has words "this" and "me"

locate -i *this*me

To view available disk space

df
above command will show disk space in KB, to view in MB use the following command
df -m

To view disk usage by files

du
to view disk space used by a directory

du dir_1
To view Linux distro

uname
uname -a
Package manager apt-get

sudo apt-get update
sudo apt-get install nginx -y
To view your IP and name in host or network

hostname
hostname -I
To know your user account

whoami
To view user id, group id, group etc.

id
Download a file from a link

curl www.randomlink.com/downloadable-file.txt -O
OR
wget www.randomlink.com/downloadable-file.txt -O downloadable-file
Service start/stop/enable/disable/restart/status

systemctl status nginx
systemctl restart nginx
systemctl stop nginx

systemctl status nginx
systemctl start nginx
systemctl disable nginx
systemctl enable nginx
To check connection to server

ping {ip address}
ping www.google.com

Bonus to read

Write clear to clean the terminal.
to autofill use TAB. Suppose you have a folder- my_folder and want to go to that folder, You just need to type cd my and then TAB and the terminal fills the rest up and makes it cd my_folder.
To stop a command write Ctrl+C
to force stop a command write Ctrl+Z
Write exit to exit from terminal

ssh - a treat for your GitHub

Abhishek S. Sharma — Sat, 08 Aug 2020 15:26:50 +0000

ssh commands

ssh creation

ssh key should be in /home/.ssh folder
to generate ssh key-

ssh-keygen

the command will ask you the name of the file, you can enter it. Let say, you named it "secure-shell" and follow the next instructions:

It will create two files in the same folder one is a public key file with extension .pub file and the other one is a private file. In our case, it will create "secure-shell.pub" and "secure-shell"
It needs your attention,

secure-shell - never share this with anybody
secure-shell.pub -to be share with a remote server that you want to excess

When you have multiple private keys then you have to add a specific key to your main identity.

eval $(ssh-agent)
ssh-add ~/.ssh/secure-shell

difference ssh-add /.ssh/secure-shell V/S ssh -i /.ssh/secure-shell ?

add will set the identity of your system for a current pointed ssh key for every commit, whether -i will set temp identity pass key(ssh key) in case you have different ssh keys added to the different remote workspaces.

GitHub access

write the following command to view the ssh-key (we will use secure-shell i.e. our key name). Please access the directory where your ssh key present. > cat .ssh/secure-shell.pub
The above command lists a key, copy it!!
Goto git account, setting > SSH and GPG keys > New ssh key and paste here
that it
Remember, you need to generate two ssh keys to access two different git accounts. Each git account will require a unique ssh key to be added. It is a good practice.

Remote access

On your local machine > cat .ssh/secure-shell.pub
The above command lists a key, copy it!!
go to the remote machine and write following command > sudo vi .ssh/authorized_key
Press i button to write
paste your key here and press ESC button
Write :wq

NOTE - how to know which ssh is currently added

ssh-add -l

It's pretty simple, right !!

Swing with git basic

Abhishek S. Sharma — Fri, 24 Jul 2020 18:03:54 +0000

Draw your git sword

Note- will start with the understanding of git commands

To see present origin repo

git remote -v

To add origin

git remote add origin --remote repo URL--

origin can be named anything but it should be remembered by you for future references
to set a new remote origin --remote repo url--

git remote set-url origin --remote repo url--

Notes

set commit username (it sets globally, please change it if you want to change your name in other commits)

git config --global user.name "Abhishek Sharma"

set commit email

git config --global user.email "imabtiwari@gmail.com"

set user name in the previous commit if it is from another user name, it will open in vi editor press i to insert words; to save it press- ESC ":wq" or to save without an edit press *:q
*

git commit --amend --author="Abhishek Sharma <imabtiwari@gmail.com>"

Kneel before git

to clone a repo

git clone --remote repo url--

branch creation

to create a new branch

git checkout -b _branchname_ 
git checkout -b _branchname-1 _

to switch branch from one to another (presently the branch is branchname-1)

git checkout _branchname_

to track changes (it will show modified files)

git status

to add a specific file

git add filename, filename2

to add all files at once

git add .

to commit on your local repo

git commit -m "commit message"

to push changes on origin

git push origin _branchname_

Checkout to another branch to merge the changes in the branch

git checkout _branchname-2_

before the merge, we will take the latest pull from this remote branchname-2

git pull origin master

now merge the branchname into branchname-2

git merge branchname-2

push changes back to the master branch

git push origin branchame-2

branch deletion

delete the branch from the local system

git branch -d _branchname_

delete the branch from a remote system

git push origin --delete _branchname_

git never forgets, it will help others to find your mistake and they blame you

details

git log

oneliner details

git log --oneline

Commit details

It will show you changes of a specific commit

git show commitID (hashcode)
e.g. git show 785767e

it points to the latest commit

git show HEAD

to see head to the previous commit

git show HEAD~1

to previous to the previous commit

git show HEAD~2

Let understand the real git process in the companies with an example-

create a GitHub account or log in to your account
Create a repo "git-basic" in your git account
create a repo in the local system

mkdir git-basic
cd git-basic

We have only one branch -master for this repo

create a branch dev

git checkout -b dev

create a file named as git-basic

touch git-basic.txt

create write in file - "I am a git ninja" and save (ctrl+s or cmd +s) this files
check this file to track the changes

git status

the git-basic file is not staged right now, so we will add the file in the stage area

git add git-basic.txt

we will commit the changes

git commit -a "first git commit"

now checkout to master branch to merge the changes

git checkout master

add remote repo (Github account repo)

git remote add origin -- remote repo url--

pull the latest update from the origin in this branch

git pull origin master

its time to merge the dev branch in master

git merge dev

push the changes in the remote directory

git push origin master

Hope, you like my post!

Thanks,
Abhishek Sharma

Life-saving git commands

Abhishek S. Sharma — Sat, 18 Jul 2020 14:26:30 +0000

1. Life-Saving git tips

We have two branches (dev and master) and one file in both branches with one commit for implementation of below scenarios

git init

touch file.txt

write something like- these are life-saving commands

git status

git add file.txt

git commit -m “First Commit”

git log

git checkout dev

git log

Now both branches have similar commits and in exact same condition, now we learn in this document the following commands

git diff
git checkout
git commit --amend
git cherry-pick
git reset (Soft, Mix, and Hard)
git clean
git reflog
git revert
print branch's hashcode

2. Gibberish fix in the file before commit check diff

add something in file write let say- asdfdsf adsdsd ssfdsf
Check the differences

git diff

To fix this

checkout file.txt

Note- Where you use this if you mistakenly unzip a file in the working directory and want to remove all these files

3.Fix wrong commit message

Now we write next change in file.txt and add a new line - yes these tips are really helpful

git status

git add

git commit -m "wrong message"

git log

you see the wrong commit message, now fix we will fix this

git commit --amend -m "right commit message"

git log

Now, you can see right commit message from which you have replaced, basically, it is a new commit, as you can see a new hash code for this commit message. It changes git history, it is a bad practice.

4. You accidentally added a file which should be not committed

Let try this,

touch not-to-be-commit.text

git status

git add not-to-be-commit.text

git commit --amend
lets write :wq

git log

and boom it disappears

5. When you commit an in the wrong branch

git branch
there are two branches

master

dev

We committed in the master branch and move that commit in dev, Also we will be returning the master in the same status it was before this commit. The Answer is cherry-pick

Cherry-pick doesn't delete any commit, it creates a new commit based on dependent commit.

Let’s implement it

git log

Pick the hash which you want to cherry-pick and copy it

git checkout dev

git log

You will see only a commit.

git cherry-pick --copied hash--

git log

Note

You brought the commit in the dev branch, however, it will not delete that commit from the master branch. to answer this we have git reset.

There are three types of git reset:

git reset soft
git reset mix
git reset hard

Let understand this with examples

Git Reset Soft

git checkout master

git log

copy the hash which one you want to have last change

git reset --soft --copied hash--

git log

You can see you no longer have that commit, which is good that we don't want it longer.

git status

Now, you can see that there are some files in the stage area, by this command, you will not lose the work.

Git Mix

git reset -copied hash-

git log

You can see you no longer have that commit, which is good that we don't want it longer.

git status

Now, you can see that there are some files in the un-stage area, it’s on you, whatever you want to do- can add changes or delete*

Git Hard

git reset --hard -copied hashcode-

git log

git status

Boom!! Nothing is left and you are on your previous commit. New changes totally deleted!!

Bonus: You want to get rid of the leftover- untracked file

git clean -df

d- directory

f-files

#### 6. When you want to track what you have done

git reflog

7. What if mistakenly run git hard and badly want the code back

git reflog

grab and copy the hash before the reset

git checkout -copied hash-

You are in the copied hash, remember everything is hash in git (branch,commit and anything), run git log in this hash

git log

You clearly can see there are the commit we have reset earlier.

git branch backup

git branch

git checkout master

git branch

git checkout backup

Isn't reflog a lifesaver?

8. You wanna undo the commit but other people pull that changes

git revert- Git revert not delete or modify any commit, it simply creates a new commit top of those that completely undo the changes, so that history remains intact.

git log

copy the hash which you want to revert

git revert -copied hash-

Write- :wq

git log

You can see there three commits- two are untouched and we have new commit with revert. if you see the file it undid the previous changes. To see these changes run diff command-

git diff -old copied hash- -reverted has(new commit)

Remember, I said everything(branch, commit) in the git has hashcode

Lets, try this- we have three branches. You already know you have git in this directory by writing a command **git init. Now, we will be doing print the hashcodes these branches. Try and run following commands

ls -al .git
ls -la .git/refs
ls -la .git/refs/heads
cat .git/refs/heads/master
cat .git/refs/heads/dev
cat .git/refs/heads/backup

All these branches have different hashcodes