- Introducció a NodeJS i NPM: En aquest vídeo poder veure com instal·lar NodeJS a Ubuntu, i veure'm el bàsic sobre l'ús de npm com a gestor de paquets. Comparació de com s'utilitzaven abans (desenvolupament web clàsic) llibreries Javascript de tercers i com ho fem ara amb NPM.
- Paquets (bundles) i Javascript. Distribució d'aplicacions i paquets Javascript, Webpack, Laravel Mix, Vue i Vite: Vídeo llarg per fer en dues sessions. Veurem com a evolucionat Javascript, les versions del llenguatge per acabar tenint clar que us recomano utilitzar ES6 la última versió. Veurem el problema ja solucionat actualment de treballar amb programació modular amb Javascript i finalment les eines que ens ajuden a oblidar-nos de tots aquests problemes i poder centrar-nos en el codi: Web Build tools (Webpack i Vite) i amb Laravel, Laravel Mix basat en webpack.
Cal saber:
-
Versions de javascript. https://www.educative.io/blog/javascript-versions-history
-
Javascript en entorn client i entorn de servidor. Javascript com un dels entorns més multiplataforma del moment? El nou Java?
-
Electronjs: Javascript per aplicacions escriptori
-
ExpressJS: Web framework (Laravel per javascript?): https://expressjs.com/
-
Javascript i la programació modular:
-
import/export: ECMAScript modules
-
En tema mòduls/paquets qu no suporten els Navegadors? Que no suporta NodeJS?
-
Per què necessitem Web build Tools? A més de per empquetar per altres tasques de construcció com:
-
Compilació assets: imatges, CSS, suport de llenguatges per a CSS com Sass o Less, Tailwind CSS.
-
Millores en rendiment i altres: minimitzacions de fitxers, source maps, versioning/cache busting, suport de frameworks com Vue...
-
Bundlers/Empaquetadors/Web development build tools:
- Webpack: https://webpack.js.org/
- Vite: https://harlanzw.com/blog/how-the-heck-does-vite-work/
- Laravel mix (utilitza webpack) https://laracasts.com/series/learn-laravel-mix/episodes/3
Cal saber:
- Què és Laravel Mix? (abans Laravel elixir)
- Laravel Mix utilitza webpack. És un wrapper de webpack per poder utilitzar webpack sense tenir que ser un expert en la eina. A més ja adaptat a laravel i la majoria de casos ús més habituals. No cal ser un expert però 4 coneixements sobre webpack poden anar bé.
- Utilitza NodeJs i NPM. Vegeu els vídeos anteriors. De fet utilitza Javascript i es distribueix via NPM
- Codi font Laravel Mix: https://github.com/laravel-mix/laravel-mix
- Paquet npm: https://www.npmjs.com/package/laravel-mix
- Conèixer cursos de tercers -> laracasts: https://laracasts.com/series/learn-laravel-mix
- Fitxer de configuració webpack.mix.js
- Laravel porta ja per defecte instal·lat i configurat amb plantilla mínima Laravel Mix.
- Conèixer els Npm scripts relacionats amb Laravel mix. Fitxer packaje.json. https://laracasts.com/series/learn-laravel-mix/episodes/2
https://github.com/acacha/101_NODEJS_NPM
- Crear compte al web https://www.npmjs.com/signup
- Hello world node.js
- Lodash: https://lodash.com/
- cross-env: https://www.npmjs.com/package/cross-env
- Upgrade: http://acacha.org/mediawiki/Upgrade#.YV22eVNByV4
- https://youtu.be/w8j07_DBl_I
- https://www.youtube.com/channel/UColShZx2cvqR28k_wOVPRUg
- https://nodejs.org/en/
- https://www.npmjs.com/package/nps
- https://www.w3schools.com/nodejs/nodejs_get_started.asp
- https://medium.com/codex/8-powerful-npm-packages-for-all-web-developers-e626a0ce0784
- https://codingpotions.com/npm-tutorial
- https://lodash.com/docs/#now
- https://github.com/you-dont-need/You-Dont-Need-Lodash-Underscore
- https://www.w3schools.com/js/js_whereto.asp