Vídeo Youtube

https://tubeme.acacha.org/101

El vídeo pot tenir alguns petits canvis per canvis de versions, consulteu els comentaris de Youtube i afegiu els vostres propis amb preguntes en cas de dubtes o fins i tot pengeu solucions a problemes que podeu haver trobat.

Versió Ubuntu

lsb_release -a
No LSB modules are available.
Distributor ID:	Ubuntu
Description:	Ubuntu 22.04.3 LTS
Release:	22.04
Codename:	jammy

Editor de text

En el meu cas per terminal veureu que utilitzo joe, però podeu utilitzar el editor que més us agradi (nano, vi, etc).

Un altre tema és la edició de codi. Utilitzarem Jetbrains PHPStorm.

Navegador web

Instaleu Chrome (utilitzarem molt la Developer Tools): https://www.google.com/chrome

Instal·lació de paquets

sudo apt-get update && sudo apt-get dist-upgrade
sudo apt-get install libfuse2 joe

Terminal Zsh ( oh my zh)

https://ohmyz.sh/

sudo apt-get install zsh wget
rm -rf ~/.oh-my-zsh
sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"
cd 
wget https://raw.githubusercontent.com/rupa/z/master/z.sh

Configuració:

joe .zshrc

Aniré repassant en cada apartat futur que cal configurar en aquest fitxer, però aquí teniu un exemple de com ha de quedar el final del fitxer:

export PATH="$HOME/.config/composer/vendor/bin:$PATH"
source /home/profe/z.sh

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  # This loads nvm bash_completion

Cada cop modifiqueu el fitxer executeu:

source ~/.zshrc

Us recomano que també mantingueu la configuració de bash igual que zsh (mateix final de fitxer)

joe ~/.bashrc

GIT

sudo apt-get install git

I configureu amb (OCO! cambieu els valors al que us pertoqui):

git config --global user.email «[email protected]»
git config --global user.name «El vostre nom»

Plugin zsh

https://github.com/ohmyzsh/ohmyzsh/tree/master/plugins/git

Github

Creeu-vos un usuari a:

https://github.com/ https://github.com/signup?user_email=&source=form-home-signup

Organització del codi

IMPORTANT: canvieu acacha per l'username del vostre usuari:

cd
mkdir Code
cd Code
mkdir acacha
cd acacha

Github CLI

Instal·leu github CLI:

https://cli.github.com/ https://github.com/cli/cli/blob/trunk/docs/install_linux.md

type -p curl >/dev/null || (sudo apt update && sudo apt install curl -y)
curl -fsSL https://cli.github.com/packages/githubcli-archive-keyring.gpg | sudo dd of=/usr/share/keyrings/githubcli-archive-keyring.gpg \
&& sudo chmod go+r /usr/share/keyrings/githubcli-archive-keyring.gpg \
&& echo "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/githubcli-archive-keyring.gpg] https://cli.github.com/packages stable main" | sudo tee /etc/apt/sources.list.d/github-cli.list > /dev/null \
&& sudo apt update \
&& sudo apt install gh -y

Executeu:

gh auth login
? What account do you want to log into? GitHub.com
? What is your preferred protocol for Git operations? SSH
Generate a new SSH key to add to your GitHub account? Yes
? Enter a passphrase for your new SSH key (Optional) 
? Title for your SSH key: GitHub CLI
? How would you like to authenticate GitHub CLI? Login with a web browser

! First copy your one-time code: 7B23-9ED8
Press Enter to open github.com in your browser... 
✓ Authentication complete.
- gh config set -h github.com git_protocol ssh
✓ Configured git protocol
✓ Uploaded the SSH key to your GitHub account: /home/profe/.ssh/id_ed25519.pub
✓ Logged in as acacha

Baixeu el codi del profesor:

El trobareu a:

https://github.com/acacha

cd ~/Code/acacha
gh repo clone acacha/casteaching

Pàgina de Github:

https://github.com/acacha/casteaching

Javascript

NodeJS amb NVM

Us recomano utilitzar nvm per instal·lar nodejs. Podeu trobar la info de nodejs a:

https://nodejs.org/en/download

cd
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.5/install.sh | bash
source .zshrc
nvm install node
node -v

PHP

sudo apt-get install php-cli
php -v
PHP 8.1.2-1ubuntu2.14 (cli) (built: Aug 18 2023 11:41:11) (NTS)
Copyright (c) The PHP Group
Zend Engine v4.1.2, Copyright (c) Zend Technologies
with Zend OPcache v8.1.2-1ubuntu2.14, Copyright (c), by Zend Technologies

Extensions de PHP:

sudo apt-get install php8.1-curl php8.1-mbstring php8.1-xml php8.1-zip

Composer

php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"
php -r "si (fitxer_hash('sha384', 'composer-setup.php') === 'e21205b207c3ff031906575712edab6f13eb0b361f2085f1f1237b7126d785ecf207c3ff031906575712edab6f13eb0b361f2085f1f1237b7126d785ecf326d6465d82264 2') { echo 'Instal·lador verificat'; } else { echo 'Instal·lador corrupte'; unlink ('composer-setup. php'); } echo PHP_EOL;"
php composer-setup.php
php -r "unlink('composer-setup.php');"
sudo mv composer.phar /usr/sbin/composer

Laravel

Afegiu el instal·lador de Laravel:

composer global require laravel/installer

Aneu a la vostra carpeta de codi:

cd ~/Code/ELVOSTRENOMUSUARIGITHUB

I executeu:

laravel new prova

Escolliu

Entreu al projecte Laravel:

cd prova

Comproveu que el procés típic que utilitzarem de git/github/github_cli funciona correctament:

git status
git add .
git status
git commit -m "First commit"
git status
gh repo create
? What would you like to do? Push an existing local repository to GitHub
? Path to local repository .
? Repository name prova
? Repository owner acacha
? Description Primer projecte Laravel
? Visibility Public
✓ Created repository acacha/prova on GitHub
? Add a remote? Yes
? What should the new remote be called? origin
✓ Added remote [email protected]:acacha/provan.git
? Would you like to push commits from the current branch to "origin"? Yes
...
To github.com:acacha/prova.git
 * [new branch]      HEAD -> master
La branca «master» està configurada per a seguir la branca remota «master» de «origin».
✓ Pushed commits to [email protected]:acacha/provan.git
gh browse

Aviat veureu com funciona git... no us preocupeu de moment.

Ara de moment vegeu si el vostre projecte Laravel funciona amb:

php artisan serve

El resultat ha de ser al navegador a la URL:

http://127.0.0.1:8000/

veure:

Laravel valet

Requeriments:

sudo apt-get install network-manager libnss3-tools jq xsel

composer global require cpriego/valet-linux

Instal·lació i configuració:

valet install

Assegureu-vos esteu a la carpeta del vostre projecte Laravel prova creat a l'apartat anterior:

cd /home/profe/Code/acacha/prova

Ara podreu accedir al vostre projecte amb un nom de domini:

valet link  
A [prova] symbolic link has been created in [/home/profe/.valet/Sites/prova].
valet links
+-------+-----+-------------------+-------------------------------+-----+
| Site  | SSL | URL               | Path                          | PHP |
+-------+-----+-------------------+-------------------------------+-----+
| prova |     | http://prova.test | /home/profe/Code/acacha/prova | 8.1 |
+-------+-----+-------------------+-------------------------------+-----+
valet open

Jetbtrains Tools

Descarregar Toolbox app de:

https://www.jetbrains.com/toolbox-app/

Es tracta d'un fitxer tar que heu de descomprimir. Un cop descomprimit executeu amb:

chmod +x jetbrains-toolbox 
./jetbrains-toolbox

És una eina gràfica sense gaire misteri. Instal·leu les següents eines:

phpstorm
Datagrip
Android Studio

Configuracions personals

Compte Github students

Assegureu-vos d'estar logats prèviament a Github.

Aneu a:

https://education.github.com/students

I feu SignUp for Global Campus. Escolliu que sou un alumne (student)

How do you plan to use GitHub?

poseu:

In my development classes

Feu permet a la localització i continueu.

Pel que fa a la foto, utilitzeu el carnet de l'institut. Manipuleu la imatge per que aparegui el text:

valid until 2024

Assegureu-vos que la imatge és jpg i pesa més de 100KB, podeu utilitzar:

https://imagy.app/resize-image-to-100kb/

Haureu d'esperar segurament un temps prudencial (pot tardar més d'un dia) en rebre un correu de confirmació.

Els emails que rebreu de Github i Digital Ocean seran:

Dins del email hi ha un link es important que hi accediu, el link serà tipus:

https://education.github.com/globalcampus/student?email_referrer=true

Oco! A vegades no s'actualitza si ja havieu entrat. Sortiu del navegador completament (totes les pestanyes i si cal reinicieu el ordinador).

El email:

Espereu a rebre el que diu Your request to join has been approved

Digital Ocean

Un cop sigueu aprovats com a Github students, podeu accedir a la URL:

https://education.github.com/students

ATENCIÓ PERÒ:

La web no la heu de veure així:

Sinó així:

Lo important és el link:

Get access by connecting your GitHub account on DigitalOcean

Assegureu-vos d'accedir des de la URL/link que apareix al email de confirmació:

https://education.github.com/globalcampus/student?email_referrer=true

Aneu a Students -> Explore students program

i feu click a Student Developer pack

Abans accedir al link:

https://cloud.digitalocean.com/github-student-pack?onboarding_origin=github-student-pack&activation_redirect=/github-student-pack

Creeu un usuari de Github (Signup):

Us demanaran fer un pagament de 1$ que realment no es un pagament sinó una comprovació de la targeta. Un cop tingueu usuari de digital Ocean i ara si un cop dins de Digital Ocean accediu al linkl per aplicar els 200$:

https://cloud.digitalocean.com/registrations/new?redirect_url=https%3A%2F%2Fcloud.digitalocean.com%2Fgithub-student-pack%3Fonboarding_origin%3Dgithub-student-pack%26activation_redirect%3D%2Fgithub-student-pack&activation_redirect=https%3A%2F%2Fcloud.digitalocean.com%2Fgithub-student-pack&onboarding_origin=github-student-pack

Us tornareu a logar utilitzant Github i aprovareu lligar el compte de Github amb Digital Ocean.

Us han d'apareixer al final la següent pantalla: