Git commands [Branching & Merging]

1. cd to your working directory
2. git log : see what commit has been made
3. git branch [branch_name] : create a new branch
4. git branch : list out all the branches (* shows you what branch you’re on)
5. git checkout [branch_name] : switch branch
6. git add .
7. git commit  -m “[message]”
8. git log
9. git merge [branch_name] 
10. git push origin [branch_name] -u

Regular Function vs Arrow Function

Regular Functions

1. May or may not have a name, can be anonymous
2. With name may be hoisted eg can declare function in a specific scope and call that function before its actually declare
3. Able to have access the arguments

Arrow Functions

1. always anonymous
2. Cannot be hoisted
3. Doesnt have own this so in arrow function, variables will be borrowed or taken from out of context.It may be useful in some node. It will refer to window like the global object hence you can’t perform some changes like the button or the dropdown menu
4. Doesnt have access to arguments
5. assign arrow function to variables and declaration of variables using const
6. Usually used as callback functions which is a function that is passed as a argument in a call to another function cos callback function dont required to be named.
7. Can be used as an immediately invoked arrow functions.

Declarative Programming vs Imperative Programming in React

 Declarative Programming 

Example 1
[in App.js]

var isDone = true;

  const strikeThrough = {textDecoration : "line-through"}

  return <p style={isDone ? strikeThrough : null}>Buy Milk</p>

 Imperative Programming

Example 1
[in index.js]

document.getElementById("root").style.textDecoration = "line-through";

Example 2 
[in App.js]

function strike(){

  document.getElementById("root").style.textDecoration="line-through";

}

function unstrike(){

  document.getElementById("root").style.textDecoration=null;

}

function App() {

  return(

    <div>

  <p>Buy Milk</p>

  <button onClick={strike}>Change to strike through</button>

  <button onClick={unstrike}>Undo</button>

  </div>

    ) };

Permission Error when trying to create new react app

npm ERR! code EPERM
npm ERR! syscall open
npm ERR! path C:\Users\pc~1\AppData\Roaming\npm-cache\_cacache\tmp\5f495f30
npm ERR! errno -4048
npm ERR! Error: EPERM: operation not permitted, open 'C:\Users\pc~1\AppData\Roaming\npm-cache\_cacache\tmp\5f495f30'
npm ERR!  [OperationalError: EPERM: operation not permitted, open 'C:\Users\pc~1\AppData\Roaming\npm-cache\_cacache\tmp\5f495f30'] {
npm ERR!   cause: [Error: EPERM: operation not permitted, open 'C:\Users\pc~1\AppData\Roaming\npm-cache\_cacache\tmp\5f495f30'] {
npm ERR!     errno: -4048,
npm ERR!     code: 'EPERM',
npm ERR!     syscall: 'open',
npm ERR!     path: 'C:\\Users\\pc~1\\AppData\\Roaming\\npm-cache\\_cacache\\tmp\\5f495f30'
npm ERR!   },
npm ERR!   isOperational: true,
npm ERR!   errno: -4048,
npm ERR!   code: 'EPERM',
npm ERR!   syscall: 'open',
npm ERR!   path: 'C:\\Users\\pc~1\\AppData\\Roaming\\npm-cache\\_cacache\\tmp\\5f495f30'
npm ERR! }
npm ERR!
npm ERR! The operation was rejected by your operating system.
npm ERR! It's possible that the file was already in use (by a text editor or antivirus),
npm ERR! or that you lack permissions to access it.
npm ERR!
npm ERR! If you believe this might be a permissions issue, please double-check the  
npm ERR! permissions of the file and its containing directories, or try running     
npm ERR! the command again as root/Administrator.
npm ERR! code EPERM
npm ERR! syscall open
npm ERR! path C:\Users\pc~1\AppData\Roaming\npm-cache\_cacache\tmp\21bcf4ec
npm ERR! errno -4048
npm ERR! Error: EPERM: operation not permitted, open 'C:\Users\pc~1\AppData\Roaming\npm-cache\_cacache\tmp\21bcf4ec'
npm ERR!  [OperationalError: EPERM: operation not permitted, open 'C:\Users\pc~1\AppData\Roaming\npm-cache\_cacache\tmp\21bcf4ec'] {
npm ERR!   cause: [Error: EPERM: operation not permitted, open 'C:\Users\pc~1\AppData\Roaming\npm-cache\_cacache\tmp\21bcf4ec'] {
npm ERR!     errno: -4048,
npm ERR!     code: 'EPERM',
npm ERR!     syscall: 'open',
npm ERR!     path: 'C:\\Users\\pc~1\\AppData\\Roaming\\npm-cache\\_cacache\\tmp\\21bcf4ec'
npm ERR!   },
npm ERR!   isOperational: true,
npm ERR!   errno: -4048,
npm ERR!   code: 'EPERM',
npm ERR!   syscall: 'open',
npm ERR!   path: 'C:\\Users\\pc~1\\AppData\\Roaming\\npm-cache\\_cacache\\tmp\\21bcf4ec'
npm ERR! }
npm ERR!
npm ERR! The operation was rejected by your operating system.
npm ERR! It's possible that the file was already in use (by a text editor or antivirus),
npm ERR! or that you lack permissions to access it.
npm ERR!
npm ERR! If you believe this might be a permissions issue, please double-check the  
npm ERR! permissions of the file and its containing directories, or try running     
npm ERR! the command again as root/Administrator.
npm ERR! code EPERM
npm ERR! syscall open
npm ERR! path C:\Users\pc~1\AppData\Roaming\npm-cache\_cacache\tmp\2deddd01
npm ERR! errno -4048
npm ERR! Error: EPERM: operation not permitted, open 'C:\Users\pc~1\AppData\Roaming\npm-cache\_cacache\tmp\2deddd01'
npm ERR!  [OperationalError: EPERM: operation not permitted, open 'C:\Users\pc~1\AppData\Roaming\npm-cache\_cacache\tmp\2deddd01'] {
npm ERR!   cause: [Error: EPERM: operation not permitted, open 'C:\Users\pc~1\AppData\Roaming\npm-cache\_cacache\tmp\2deddd01'] {
npm ERR!     errno: -4048,
npm ERR!     code: 'EPERM',
npm ERR!     syscall: 'open',
npm ERR!     path: 'C:\\Users\\pc~1\\AppData\\Roaming\\npm-cache\\_cacache\\tmp\\2deddd01'
npm ERR!   },
npm ERR!   isOperational: true,
npm ERR!   errno: -4048,
npm ERR!   code: 'EPERM',
npm ERR!   syscall: 'open',
npm ERR!   path: 'C:\\Users\\pc~1\\AppData\\Roaming\\npm-cache\\_cacache\\tmp\\2deddd01'
npm ERR! }
npm ERR!
npm ERR! The operation was rejected by your operating system.
npm ERR! It's possible that the file was already in use (by a text editor or antivirus),
npm ERR! or that you lack permissions to access it.
npm ERR!
npm ERR! If you believe this might be a permissions issue, please double-check the  
npm ERR! permissions of the file and its containing directories, or try running     

npm ERR! the command again as root/Administrator.

Solution:- 
1) run npm config edit in command prompt
-  change this line to ; cache=C:\Users\pc\AppData\Roaming\npm-cache

2) run npm uninstall -g create-react-app in command prompt as admin mode

3) npx create-react-app <folderName> : create a new react app

4) cd <folderName>

5) npm start : launch react app

Basic commands

 [Window]
1) dir : list out all the files and folder inside the directory
2) dir /w : dispay text horizontally 3) npm config edit : enter into your config file
4) echo "" >.gitignore : create a new file .gitignore

[Mac]

1) ls : list out all the files and folder inside the directory

Create new React App

 [Windows - run in admin mode]

1) Open Command Prompt/Hyper and run as administrator
2) cd <directoryName> :  Change directory to the folder where you want to store your react app.
3)  npx create-react-app <folderName> : create a new react app 4) cd <folderName> : Change directory. 5) npm start : To launch your react app

[Window - non admin mode]

1) Open Command Prompt/Hyper terminal
2) npx create-react-app <fileName> : Create a new react App
3) cd <folderName> : Change directory. 4) npm start : To launch your react app

Website designs

Here are some of the websites that i have done using AdobeDreamweaver, Adobe Illustrator and Adobe Fireworks.

Website One:

Website Two:

Home page

Website Design Three:

Website Design 4:

Spongebob faces

i was bored at home! so i started to draw the cartoons of spongebob faces again! :D

Designing with ThomastheCoach!

Package 1:

Package 2:

Design 2:

I was being given this task to actually spend 3 hours to design 2 flyers for Thomas and here are some of my works.

Wohoo! Hope that it wont look werid ba! =x

I know its not very creative but feeling so happy that i'm able to come up with some designs for the whole afternoon. Even though Thomas has instructed me to finish it within 3 hours.

However, my computer crashes! Thats why i have to redo everything again LOL! ):

But Thomas still asked me to do some improvement on it. Still wondering, how can i improve on it..

Still I am contented to be able to work with Thomas this time round. Hope that we can work together next time.

Cheers,

♥♥♥Abrial♥♥♥

Thomas the coach! :D

Found an event job through gumtree and ended up being hired as a designer for http://www.thomasthecoach.com. ^-^

Even though i major in web designing but i don't mind trying out new stuff Cos I loves to take up challenges.

Went for this talk at ThomasTheCoach and it teaches us how to play with stocks.

It seemed interesting to me and personally, I feel that the trainers are very professional, especially Thomas, who has taught us many tips in dealing with stocks. The trainers are very professional as they have guided us step-by-step in how to use the program. Besides that, by signing up for their course, students will receive free goodies!

Call 6384 0143 NOW FOR MORE DETAILS!

There's a seminar this October. Stay tuned! :)

♥♥♥Abrial♥♥♥