ReactJS: Create your first react app.

React is one of the most in-demand and popular JavaScript library. And the reason is simple it gives you the ability to create complex User Interfaces with minimal and simplified code.

In this article we are going to go through the installation process and the process of creating your first react app.

Creating a react js app.

There are a few different ways of creating a react app. But the simplest way is using a CDN – link. This allows you to start using ReactJS instantly, without any installation setup.

Just include these two lines in your HTML file.

<script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>

But this is not the best way of creating a react app. The best way to create a react app is Using react CLI, but for that, you need to have NodeJS installed.

Once NodeJS is installed in your system. Now there are two ways of creating react app.

The Quick way (npx):

Use the following command in your preffered terminal.

npx create-react-app <app-name>
cd <app-name>
npm start

The first line will create a react app and name it. And the third line will open the app in your default browser. Which looks something like this.

The productive way (NPm):

In this way first we will install NPM (Node package manager) then will create the react app.

That’s why i call this way as the productive way, because soon or late you would have to install NPM then why not now.

Follow these command below.

npm install -g
cd <app-name>
npm start

The first line installs npm globally. And you know what the next two line does.

Actually we can also create a react app via yarn. But we are just not gonna get into it in this post.

So, i hope this was helpful to you.

Thank You.

How to learn Git in 15 minutes? List of most basic git commands

Git is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency. Git is easy to learn and has a tiny footprint with lightning fast performance. Every dev has a working copy of the code and full change history on their local machine

Here are some most important and useful GIT commands that will surely help you.

Git Commands:

  • This command sets the author name and email address respectively to be used with your commits.
$ git config –global user.name "[name]" 
$ git config –global user.email "[email address]"
  • This command is used to start new repository.
$ git init [repository name]
  • This command is used to obtain a repository from an existing URL.
$ git clone [url]  
  • This command records or snapshots the file permanently in the version history.
$ git commit -m "[Type in the commit message]"
  • This command lists all the files that have to be committed.
$ git status 
  • This command shows the metadata and content changes of the specified commit.
$ git show [commit]
  • These commands lists, creates and delete branch respectively.
$ git branch  
$ git branch [branch name]  
$ git branch -d [branch name]  
  • This command is used to connect your local repository to the remote server.
$ git remote add [variable name] [Remote Repo Link]  

  • This command sends the committed changes of master branch to your remote repository.
$ git push [variable name] master  
  • This command sends the branch commits to your remote repository.
$ git push [variable name] [branch]
  • This command pushes all branches to your remote repository.
$ git push –all [variable name]
  • This command deletes a branch on your remote repository.
$ git push [variable name] :[branch name]
  • This command fetches and merges changes on the remote server to your working directory
$ git pull [Repository Link]

If you want more commands with examples, please let us know in the comments below.

More Useful commands:

  • Checks if sha is in production.
$ git tag --contains [sha]
  • Number of commits by author.
$ git shortlog -s --author 'Author Name'
  • List of authors and commits to repository sorted alphabetically.
$ git shortlog -s -n
  • See differences in file before committing / compare recently edited file with its last committed state
$ git diff path/to/file.txt
  • Undo local changes to a file.
$ git checkout -- filename
  • Undo/revert last commit
git revert HEAD^
  • Remove last commit from history (WITHOUT keeping changes)
$ git reset --hard HEAD~
  • Remove last commit from history (WITH keeping changes)
$ git reset HEAD~
  • Shows number of lines added or removed from repository by an author since some time in the past.
$ git log --author="Author name" --pretty=tformat: --numstat --since=month | awk '{ add += $1; subs += $2; loc += $1 - $2 } END { printf "added lines: %s, removed lines: %s, total lines: %s\n", add, subs, loc }'

referenceS:

https://gist.github.com/davfre/8313299#undoing-previous-actions

https://stackoverflow.com/questions/8903953/how-to-revert-last-commit-and-remove-it-from-history

https://github.com/bpassos/git-commands#committing-files