Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/layer-se7en/dev-setup

How to set up Web-Dev Enviroment on M1 Mac
https://github.com/layer-se7en/dev-setup

airbnb-eslint airbnb-javascript eslint eslint-config-airbnb github homebrew homebrew-cask node nvm oh-my-zsh oh-my-zsh-theme ohmyzsh prettier prettier-eslint ssh-key visual-studio-code visual-studio-code-extension visual-studio-code-theme zsh zshrc

Last synced: 16 days ago
JSON representation

How to set up Web-Dev Enviroment on M1 Mac

Awesome Lists containing this project

README 

        
# How to set up Web-Dev Enviroment on M1 Mac

# In this guide I will show you

- how to install homebrew 

- how to install all necessary apps and extensions 

- how to install Spaceship theme with Oh-My-Zsh

- how to install node

- how to setup eslint with airbnb style guide

- how to add SSH-KEY to github account



## 1. Downlod dev-setup-scripts.zip



download link for dev-setup-scripts.zip



------------------------------------------------------------------------------------------------------------------------------------------------------------------



## 2. Setting Up Rosetta Terminal



#### `[press command + Space]`



that should open Spotlight



![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/spotlight.png)



type the following into Spotlight:



```

/applications

```

![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/Screen%20Shot%202021-03-02%20at%205.02.14%20PM.png)



#### double click on Applications Folder



------------------------------------------------------------------------------------------------------------------------------------------------------------------



### Applications Folder should open



![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/Screen%20Shot%202021-03-02%20at%205.02.24%20PM.png)

------------------------------------------------------------------------------------------------------------------------------------------------------------------

type the following into search:

![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/Screen%20Shot%202021-03-02%20at%205.02.32%20PM.png)



```

Terminal

```



choose search Applications



![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/Screen%20Shot%202021-03-02%20at%205.02.44%20PM.png)



right-click Terminal 



![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/Screen%20Shot%202021-03-02%20at%205.05.00%20PM.png)



click on Duplicate



![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/Screen%20Shot%202021-03-02%20at%205.05.03%20PM.png)



if asked enter your password & press ok



right-click duplicated Terminal & click on Rename



![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/Screen%20Shot%202021-03-02%20at%205.05.32%20PM.png)



rename the duplicated Terminal to:



```

Rosetta Terminal

```



if asked enter your password & press ok



right-click Rosetta Terminal & click on Get Info



![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/Screen%20Shot%202021-03-02%20at%205.05.57%20PM.png)



in the Rosetta Terminal Info window make sure Open using Rosetta is checked



![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/Screen%20Shot%202021-03-02%20at%205.06.04%20PM.png)



#### Close Rosetta Terminal Info by clicking red ❌



double click on Rosseta Terminal



------------------------------------------------------------------------------------------------------------------------------------------------------------------



### Rosetta Terminal should open



----------------------------------------------------------------------------------------------------------------------------------------------------------------



lets check if we are using Rosetta



type the following into Terminal: 



```

arch 

``` 



#### `[press Enter]`



if your Rosetta Terminal returned 



i386



![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/Screen%20Shot%202021-03-02%20at%205.06.27%20PM.png)



Good Job you did everything correct so far. 

------------------------------------------------------------------------------------------------------------------------------------------------------------------

## 3. Installing Homebrew



type the following into Rosetta Terminal:



```

cd

```



#### `[press Enter]` 



type the following into Rosetta Terminal:



```

mkdir homebrew && curl -L https://github.com/Homebrew/brew/tarball/master | tar xz --strip 1 -C homebrew

```



#### `[press Enter]` 



type the following into Rosetta Terminal:



```

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

```



#### `[press Enter]`



#### &



### if prompted to enter your Password, enter your Password, after entering your Password `[press Enter]`   



## AFTER A LITTLE WHILE TERMINAL WILL PROMPT YOU "TO CONTINUE WITH DOWNLOADING HOMEBREW PRESS RETURN" = `[press Enter]`



## IF YOU DON'T `[press Enter]` DOWNLOAD WILL NOT BEGIN!



------------------------------------------------------------------------------------------------------------------------------------------------------------------



Wait patiently as this may takes a while (install can take around 4-5 minutes).🧐



After a little awhile Homebrew should be installed. 😊



------------------------------------------------------------------------------------------------------------------------------------------------------------------



### only continue to step 4 after Homebrew is installed 



------------------------------------------------------------------------------------------------------------------------------------------------------------------



## 4. Setting Up Download Scripts



type the following into Rosetta Terminal:

 ```

cd /Users/`whoami`/Downloads/dev-setup-scripts

 ```

 

#### `[press Enter]`



------------------------------------------------------------------------------------------------------------------------------------------------------------------



type the following into Terminal: 



```

ls

```



#### `[press Enter]`



#### if any prompts open click on ok/allow



------------------------------------------------------------------------------------------------------------------------------------------------------------------



### Compare this list to what your Terminal returned (if you are in dev-setup-scripts folder you should have all of these files)



------------------------------------------------------------------------------------------------------------------------------------------------------------------



- brew-install-cask.txt



- brew-install.txt



- vscode-settings.txt



- zshrc.txt



------------------------------------------------------------------------------------------------------------------------------------------------------------------



### If you indeed have all those files skip over to step 5 Installing Packages & Applications



------------------------------------------------------------------------------------------------------------------------------------------------------------------



### if your Terminal didn't return that or you dont have those files do the following



------------------------------------------------------------------------------------------------------------------------------------------------------------------



#### `[press command + SPACE]`



![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/spotlight.png)



in Spotlight type:



```

dev-setup-scripts

```



#### `[press Enter]`



------------------------------------------------------------------------------------------------------------------------------------------------------------------



### Finder should open where dev-setup-scripts folder has been downloded



------------------------------------------------------------------------------------------------------------------------------------------------------------------



#### click on dev-setup-scripts folder



#### &



#### `[press command + C]`



------------------------------------------------------------------------------------------------------------------------------------------------------------------



### go back into Terminal



------------------------------------------------------------------------------------------------------------------------------------------------------------------



type the following into Terminal: 



```

cd

```



#### `[press Space]`



#### &



#### `[press command + V]`



### it should like something like this



cd /Users/{YOUR_USERNAME}/{FOLDER_NAME_THE_FILE_IS_IN}/dev-setup-scripts



### if it does great, if not redownload the dev-setup-scripts.zip file into Downloads folder and repeat step 3 from beginning.



#### `[press Enter]`



------------------------------------------------------------------------------------------------------------------------------------------------------------------



### you should now be in dev-setup-scripts folder



------------------------------------------------------------------------------------------------------------------------------------------------------------------



type the following into Terminal: 



```

ls

```



#### `[press Enter]`



------------------------------------------------------------------------------------------------------------------------------------------------------------------



### Compare this list to what your Terminal returned (if you are in dev-setup-scripts folder you should have all of these files)



------------------------------------------------------------------------------------------------------------------------------------------------------------------



- brew-install-cask.txt



- brew-install.txt



- vscode-settings.txt



- zshrc.txt



------------------------------------------------------------------------------------------------------------------------------------------------------------------



### If Terminal still doesnt return this repeat step 4 from beginning again.



------------------------------------------------------------------------------------------------------------------------------------------------------------------



## 5. Installing Packages & Applications



type all of the following into Terminal at once : 



```

sudo chown -R $(whoami) /usr/local/Homebrew /usr/local/etc/bash_completion.d /usr/local/share/doc /usr/local/share/man /usr/local/share/man/man1 /usr/local/var/homebrew/locks &&

chmod u+w /usr/local/Homebrew /usr/local/etc/bash_completion.d /usr/local/share/doc /usr/local/share/man /usr/local/share/man/man1 /usr/local/var/homebrew/locks

```



#### `[press Enter]`



#### if prompted to input your Password, after inputing your Password `[press Enter]`  



type all of the following into Terminal at once : 



```

brew tap homebrew/cask-fonts

brew install $(GitHub Login Page



------------------------------------------------------------------------------------------------------------------------------------------------------------------



### login

 

#### click on your profile picture or this icon ![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/3lines.png)

 

 #### &

 

 #### click on settings 

 

 #### &

 

 #### click on SSH and GPG key

 

 ![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/ssh1.png)

 

 #### &

  

 #### Click on New SSH key 

 

 ![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/ssh3.png)

 

------------------------------------------------------------------------------------------------------------------------------------------------------------------ 



#### click into Key text area

 

#### &

  

#### `[press command + V]`

 

------------------------------------------------------------------------------------------------------------------------------------------------------------------ 

 

 ### SSH-KEY should paste into Key text area

 

------------------------------------------------------------------------------------------------------------------------------------------------------------------

 

### for title write: 

 

 ```

 macBook

 ```

 

------------------------------------------------------------------------------------------------------------------------------------------------------------------ 



 ### After you wrote the title and pasted in the SSH Key

 

------------------------------------------------------------------------------------------------------------------------------------------------------------------

 

 #### click on Add SSH key

 

  ![alt text](https://raw.githubusercontent.com/eliasbnk/dev-setup/main/img/ssh2.png)

  

------------------------------------------------------------------------------------------------------------------------------------------------------------------



#### enter in your github password 

 

#### click Confirm Password

  

------------------------------------------------------------------------------------------------------------------------------------------------------------------ 

 # you're finished, good job 😀👍

------------------------------------------------------------------------------------------------------------------------------------------------------------------