domingo, 7 de noviembre de 2021

Información importante usando el Framework Svelte

Instalar Svelte   usando rollup

Mkdir  nomcarpeta

npx degit sveltejs/template svelte

cd nomcarpeta

npm install

npm run dev, alli copiamos la url para  testear la app

Instalar Svelte   usando webpack

Mkdir  nomcarpeta

npm install svelte --save

npm install @babel/core @babel/preset-env @babel/polyfill babel-loader --save-dev   

npm install webpack webpack-cli html-webpack-plugin --save-dev

npm install webpack-dev-server --save-dev

npm install svelte-loader --save-dev

npm run build

npm run start

Crear un proyecto usando Svelte

Mkdir  nombrecarpeta

cd nombrecarpeta

git init

npm init

Code .

Creamos carpeta src  donde va el código de nuestro programa, aquí dentro creamos index.js

Creamos carpeta public



Cómo iniciar composer usando PHPUnit para test de códigos en PHP

 Iniciar proyecto composer con PHPUnit

EN WINDOWS:

composer require --dev phpunit/phpunit

rellenar el composer.json

crear un archivo, a nivel del vendor, phpunit.xml

llenar el phpunit.xml

crear la carpeta test a nivel del vendor

en consola escribir: php vendor/phpunit/phpunit/phpunit

y debe salir “No tests executed”

Si no funciona: composer dump


sábado, 6 de noviembre de 2021

Cómo subir proyecto desde consola a Gitghub

Para subir proyecto desde consola a github:


    git init

  git add .

git commit -m "first commit"

git remote add origin https://github.com/NOMBRE_USUARIO/NOMBRE_PROYECTO.git

git push -u origin master

lunes, 18 de octubre de 2021

Comandos útiles en Git

Master  es ahora main

$git    Comandos  útiles

$git --version versión git 

$git init  Inicia git

$git add  <file> Añade archivo

$git commit -m "msj"  mensaje para mantener versiones de proyecto

$git add .  agrega todos los archivos de la carpeta   (se hace  cuando se realiza cambio en archivo)

$git commit -m "cambios a v1"

git commit -am "cambios"   así no se pierde cambios

$git status  Status de la base de datos

$git show  Muestra todos los cambios hechos   $git show <archivo>

$git log <file>   Historia entera (cambios) de un archivo 

$git  push   Paso final  para llevar este a un archivo remoto

$git fetch    trae al repositorio local peor no lo copia

$git merge copia en archivos en versión actual

$git pull copio repositorio local bd y directorio (fetch y merge se resumen en este)

$ git config -l   lista  para ver usu y  correo

git config --global user.email "miemail"  configura el correo



Comandos útiles en terminal GIT


cd/mnt/e   cambia  ruta  de directorio

cd..  retrocede una carpeta

cd  U(la letra que queramos) + boton tab  busca archivos por inicial de la letra   este sirve en GIT bash

mkdir <nomproyecto>   crea carpeta

touch <nombre> crea archivo  vacío  .txt por ej

cat <nombre>  muestra contenido

history  muestra historial de comandos escritos . Luego  !#  para seleccionar el numero (# el num que uno decida  escoger para comando)

rm    borra archivo  

rm --help  muestra lista comandos (aplica para todos)

esc+shift+z+z  guarda  cambio  cuando doy  git commit  para  añadir un mensaje

git diff  commitcode   commitcode (se compara los dos códigos  de versiones de git deseadas)


git rm: este comando necesita alguno de los siguientes argumentos para poder ejecutarse correctamente: - git rm --cached: Mueve los archivos que le indiquemos al estado Untracked.
 - git rm --force: Elimina los archivos de Git y del disco duro. Git guarda el registro de la existencia de los archivos, por lo que podremos recuperarlos si es necesario (pero debemos usar comandos más avanzados).

git reset <code> --hard  todo vuelve al estado anterior
git reset <code> --soft  volvemos a versión anterior  pero no borra lo que esta en stage

git reset HEAD Saca archivos del área de staging

git log --stat  cambio especifico

q   sirve para salir cuando  queda  :

git checkout main para pasar a master en git o git checkout cabecera por ejemplo pasa a otra branch


Github

git remote add origin <url proyecto github>  añade url a git

git  remote   (debe salir origin)

 git remote -v   para ver url fetch y push

git push origin main  enviar  rama master    de ahí  ingreso token


git pull origin main --allow-unrelated-histories   así permite fusionar lo que vi con rama local

git branch -m main   renombra  la  rama por main en caso de que arroje error 

Creación llave SHH

ssh-keygen -t rsa -b 4096 -C "tu@email.com"    Genera llave SSH privada

eval $(ssh-agent -s)   para verificar que  corra el ssh

ssh-add ~/.ssh/id_rsa   Añade llave

~  para ver la ruta  

git remote set-url origin <ruta shh proyecto>   agrega ruta ssh github
 
Comandos útiles

git log --all muestra todos los commits

git log --all --graph  miestra los comits con grafica

git log --all --graph --decorate --oneline

alias arbolito="git log --all --graph --decorate --oneline"  atajo para nombrar comando largo

Tags para versiones

git tag  mira que tags hay

git tag -a <nombretag>  -m "Resultado de las primeras clases del curso" <codigo commit>   reviso versiones

git show-ref --tags  miro en que commit  esta conectado

git pull origin main  antes  para  traer los archivos

git push origin --tags envia  el tag a github

$ git tag -d <nombretag>    borra  el tag creado

$ git push origin :refs/tags/<nombretag>   borra tag

$ git show-branch  muestra ramas existentes

 git show-branch --all  muestra ramas existentes pero con mas datos

gitk  muestra historia  visual en un software

git branch <nombre>  crea un branch



git  remote add upstream <url github>  apuntador al repositorio maestro. fuente de origen

Rebase

El comando rebase es una mala práctica, nunca se debe usar, pero para efectos del curso te lo vamos a enseñar para que hagas tus propios experimentos. Con rebase puedes recoger todos los cambios confirmados en una rama y ponerlos sobre otra.
 # Cambiamos a la rama que queremos traer los cambios 
git checkout experiment 

# Aplicamos rebase para traer los cambios de la rama que queremos 
 git rebase master

Stash


Cuando necesitamos regresar en el tiempo porque borramos alguna línea de código pero no queremos pasarnos a otra rama porque nos daría un error ya que debemos pasar ese “mal cambio” que hicimos a stage, podemos usar git stash para regresar el cambio anterior que hicimos.

 git stash es típico cuando estamos cambios que no merecen una rama o no merecen un rebase si no simplemente estamos probando algo y luego quieres volver rápidamente a tu versión anterior la cual es la correcta.

Git clean

Limpia proyecto de archivos no deseados

git clean --dry-run    para saber que archivos vamos a borrar

git clean -f   borrar archivos que nos son carpetas


Git cherry pick


Existe un mundo alternativo en el cual vamos avanzando en una rama pero necesitamos en master uno de esos avances de la rama, para eso utilizamos el comando git cherry-pick IDCommit. 

 cherry-pick es una mala práctica porque significa que estamos reconstruyendo la historia, usa cherry-pick con sabiduría. Si no sabes lo que estás haciendo ten mucho cuidado.


git commit --ammend  los cambios que haremos los manda al commit anterior

git reflog    se ve todo   hash  head  (cuando se desea recuperar algo)

¿Qué pasa cuando todo se rompe y no sabemos qué está pasando? Con git reset HashDelHEAD nos devolveremos al estado en que el proyecto funcionaba. 

 git reset --soft HashDelHEAD te mantiene lo que tengas en staging ahí. 
git reset --hard HashDelHEAD resetea absolutamente todo incluyendo lo que tengas en staging.

 git reset es una mala práctica, no deberías usarlo en ningún momento; debe ser nuestro último recurso.

Buscar en archivos git

git grep color -->use la palabra color
git grep la --> donde use la palabra la
git grep -n color–> en que líneas use la palabra color
git grep -n platzi --> en que líneas use la palabra platzi
git grep -c la --> cuantas veces use la palabra la
git grep -c platzi --> cuantas veces use la palabra platzi
git grep -c “<p>”–> cuantas veces use la etiqueta <p>

git log-S “cabecera” --> cuantas veces use la palabra cabecera en
todos los commits.

grep–> para los archivos
log --> para los commits. 

Comandos y recursos colaborativos Git y Github

git shortlog -sn = muestra cuantos commit han hecho cada miembros del equipo.
git shortlog -sn --all = muestra cuantos commit han hecho cada miembros del equipo hasta los que han sido eliminado
git shortlog -sn --all --no-merge = muestra cuantos commit han hecho cada miembros quitando los eliminados sin los merges
git blame ARCHIVO = muestra quien hizo cada cosa linea por linea
git COMANDO --help = muestra como funciona el comando.
git blame ARCHIVO -Llinea_inicial,linea_final= muestra quien hizo cada cosa linea por linea indicándole desde que linea ver ejemplo -L35,50
**git branch -r **= se muestran todas las ramas remotas
git branch -a = se muestran todas las ramas tanto locales como remotas





jueves, 30 de septiembre de 2021

Webpack

¿Qué es Webpack? 

Webpack es un module bundler. Los module bundlers son herramientas para frontend devs que suelen usarlo para empaquetar los JS modules en un único archivo de JS que pueda ser ejecutado por el navegador. 

 Las razones principales por que se usan webpack son: Algunos navegadores no soportan el sistema de modulos. 

Te ayudan a manejar las relaciones de dependencias con tu código. Ayudan a cargar assets en orden de dependencias, imágenes, css, etc. 

Tener en cuenta que webpack es una filosofía que nos va permitir trabajar de forma modular. Es como menter todo lo que vamos a necesitar en un proyecto en una caja y después poder sacar todo listo para producción.


Una forma de usar webpack https://createapp.dev/webpack/no-library

mkdir nomcarpeta

cd nomcarpeta

git init Iniciamos repositorio git

npm -y   iniciamos npm en el proyecto

code .  Abrimos el codigo en  VSC

npm install webpack webpack-cli -D  instala en terminal dentro del proyecto el webpack

npx webpack  ejecuta el webpack  el proyecto

npx webpack --mode development modo desarrollo

npx webpack --mode production   modo produccion

para automatizar   vamos a package.json  y  añadimos 
"scripts": {
    "test""echo \"Error: no test specified\" && exit 1",
    "build""webpack --mode production"
  },

Luego en la terminal ejecutamos npm run build

Para clonar un proyecto   git clone   https://pag.com

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

Babel

Sirve para tranformar nuestro código JS a un código que cualquier navegador o Node.js pueda entender

npm install babel-loader @babel/core @babel/preset-env @babel/plugin-transform-runtime   instalo babel loader -D

/\.m?js$/ es una expresión regular que indica; los archivos que terminen con mjs o js

npm build  para correr programa
--------------
html 

 npm install html-webpack-plugin -D
----------------
CSS

npm install mini-css-extract-plugin css-loader -D

npm run dev luego de editar en el codigo html quitando la ruta css, el main.js y el webpack.config.js

npm install stylus -D   instala stylus   

npm install stylus stylus-loader -D

---------------------------------------
Para saas

npm i -D node-sass sass-loader

Añadimos el loader al arreglo de loaders y modificamos un poco la expresion regular

{
        test: /\.s?css$/,
        use: [MiniCssExtractPlugin.loader,
            "css-loader",
            "sass-loader"]
      },

npm i copy-webpack-plugin -D   plugin para copia en webpack


Metodología BEM para CSS

 BEM: Bloques, elementos, modificadores

Link útil para BEM: https://9elements.com/bem-cheat-sheet/

Dividir lógicamente las piezas de las que se compone una web


.bloque{}

.bloque__elemento{}

.bloque--modificador{}

Ejemplo:



Taller de oratoria en inglés (tips)



Tips by  Taller de oratoria  in Platzi


Tips

-Make a list of 5 topics of your interest. Analyze them and select 1 to be main topic of your speech

-Ask yourself WHAT do I want my audience to remember or learn about my speech?

-Express WHY your audience needs to learn about this topic

-Draft your ideas and prepare your speech

-Find a nice place to record practice!

-Record your speech





Speech 

1.    Focus on one major idea

2.    Give people a reason to care

3.    Build your idea with familiar concepts

4.    Make your idea worth sharing


Voice volume must be tempered

emotion, message, space, noise, distance




Use these 5 key points to start structuring your presentation.

-What does the audience need to hear?

-Structure the flow of your message. It does not have to be the definitive version. Create a first draft.

-Style: make it unique

-Memorize the flow, not the whole script!

-Delivery: organize the topic and your ideas. Make them clear to you so you can deliver the message effectively
 


How to put your ideas together

-What do you want the audience to remember/ understand/ believe?

-Support your message with evidence and information to validate your claims

-Make sure you include anecdotes, metaphors and opinions in your presentation.


Key points sugestions and recommendations (claims,support, connectors)

-Definition or explanation

-Elements

-Functions

-Social context

-Measurements

-Time references

-Strengths

-Consequences

-Benefits


Communication media

-Conversation and public speaking

-Messages, documents and publications

-Images and music

-Video, broadcast and social media

-Physichal environment

-Virtual and mixed reality



Concrete evidence

1.    Facts, statistics and testimonials

2.    Examples and illustrations


3.    Metaphors and analogies


Key points, suggestions and recommendations

Definitions or explanations, elements, functions, social context, measurements, time references, strengths, consequences, benefits


Get on the right mindset


-What are you good at? Acknowledge the positive!

-Accept that you make mistakes

-Have a backup plan

-Interact with the audience!


How to provide speech structure and flow

-Deliver previews in the introduction

-Highlight the transitions between the main ideas in our speech

-Supply reviews in the conclusion


The 10 minute rule

Prepare to engage your audience

- Ask provocative questions

- Provide troubling, amusing or remarkable facts

- Explain your own interest in the topic

-Tel listeners what the topic has to do with them


Example about speech


Intro:Today I will be discussing

Outline: I want to begin by.. and then I’ll move on to

Intro to the first point: I will first cover… /to get started, let’s look at

Similar points: in the same  way/ this is similar to

Disagreeing points: however/ even so / on the other hand

Transition: fundamentally/ a major issue is

Emphasizing: more importantly/ primarily /mainly

Conclude: finally, I want to say / I’d like to leave you with this



Find your public speaking voice

 -Speak slowly
 -Include different kinds of pauses in your speech
 -Read out loud   (Practice with music or poetry)
 -Record yourself!

Blogs Colombia