Paychokxxx / react-workshop-gif-portal

react-workshop-gif-portal

Workshop: Introduction to React

Build on the top of Le Wagon React boilerplate.

1. Set your laptop

Setup for Mac

Install NodeJS (https://nodejs.org/en/)

On a terminal do:

git --version
cd ~/Desktop
git clone [e-mail]:yannklein/react-workshop.git react-giphy 
cd react-giphy
rm -rf .git
git init
git add .
git commit -m "initial setup ready for workshop" 
cd workshop
rm yarn.lock
yarn install
yarn start

Open the "react-giphy" folder with SublimeText or VS Code

In your browser go to this url: localhost:8080

Setup for Windows

• Install NodeJS (https://nodejs.org/en/)
• Install Git (https://git-scm.com/download/win, during the installation select the option "use git from a Win command prompt"

Search for "Node.js prompt" in the Win menu search bar, open it and tap (press Enter after each line):

cd Desktop
git clone [e-mail]:yannklein/react-workshop.git react-giphy 
cd react-giphy
rm -rf .git
git init
git add .
git commit -m "initial setup ready for workshop" 
cd workshop
rm yarn.lock
yarn install
yarn start

Open the "react-giphy" folder with SublimeText or VS Code

In your browser go to this url: localhost:8080

2. Set you code editor

Setup for Sublime Text

1. Go to SublimeText > Preferences > Package Control

Search for "Package Control: Install Package" and press Enter.

In the appearing list, search for "Babel" and press Enter.

2. Same operations for "Babel Snippets" (some doc here)

3. Got to SublimeText > Preferences > Key Bindings

Add the code of this link on the right side.

Setup for VS code

1. Go to Code > Preferences > Extensions

Search and install "Reactjs code snippets" (some doc here)

3. Commands to run your code locally

To start the local Webpack Dev Server (usually on port 8080):

yarn start

To lint all JavaScript files in the src folder:

yarn lint

To build and deploy your app to gh-pages branch on the GitHub repo:

yarn deploy