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!

lunes, 27 de septiembre de 2021

Comandos de Terminal de Ubuntu

 Comandos útiles para npm windows terminal, react y  uso de git  


pwd  dirección actual

cd (change directory)

cd .. retrocede dos carpetas

cd/carpeta/carpeta   va directamente al directorio objetivo

cd /   directorio raiz

ls   archivos en el directorio .  listar items

cd mnt  archivos   c

cd  ~ vuelve a la raiz de carpeta  (alt gr +)

mkdir      crea una carpeta ej: mkdir carpeta

touch     crea archivo    ej: touch index .html

mv  mover archivo  de un sitio a otro ej: mv index.html  Carpeta

code.    abre el visual studio del archivo

wsl--shutdown  cada que se deje de trabajar en ubuntu

cat   muestra datos del archivo. ej: cat index.html

man   es manual  ej:  man cat

sudo apt-get update   actualiza  ubuntu

sudo apt-get upgrade  aplica los cambios de actualizacion

sudo apt install nodejs    instalar node desde terminal

clear   limpiar  código

npx  corre  programas sin instalar   npx create-react-app test

npm start inicia el proyecto

ctlr c   detiene ejecucion para react

npm start  desde new terminal en vsc  o  windows terminal para ejecutar programa

sudo chown -R miusuario micarpeta   cambia propietario de archivo

rm   borra archivo  ej: rm  index.txt

rm -d nomcarpetavacia  borra carpeta vacía

rm -rf  test    borra carpeta test

git --version  versión github

sudo apt-get update  actualiza paquetes  git

sudo apt-get upgrade actualiza paquetes git

sudo apt intall  instala git


Vincular con github desde terminal

ssh-keygen -t -rsa -b 4096 -C   tucorreo   llave para usar con github

sábado, 25 de septiembre de 2021

lunes, 13 de septiembre de 2021

Apuntes curso profesional de wordpress

Apuntes curso profesional de WordPress de Platzi.


Cómo se organiza la información en WordPress:

-Taxonomías.

-términos.

-posts.


Taxonomías por defecto

Categorías: orden jerárquico.

Tags: orden no jerárquico.


Jerarquía de archivos

Slug  

category-nombre.php     tag-nombre.php

category-4.php    category-2.php

category.php  tag.php     Genérico

archive.php   si no  encuentra ninguna de las anteriores.


¿Cómo utilizar AJAX dentro de WordPress?

Para poder hacer cosas con AJAX en Wordpress usaremos algunas funciones y cosas en particular.


En el envío de la petición se puede hacer con JQuery o con Javascript Vanilla. Nosotros envíamos tres parámetros:


url:ajaxurl → Todas las peticiones AJAX se envían a la misma url.

method → La información puede enviarse por GET o POST.

data (action) → Cada función PHP que procesará una petición AJAX se registra.

Una vez que la función la recibe Wordpress, para poder recibirla necesitamos que esta función esté registrada. Para registrarla tenemos dos opciones:


wp_ajax() → Las funciones se registran con este hook para los usuarios logeados.

wp_ajax_nopriv() → Las funciones se registran con este hook para funcionar sin usuarios logeados.

Y las funciones de respuestas son:


wp_send_json() → Nos va permitir enviar la respuesta del servidor en formato JSON. Esta función puede recibir un string o un Array, y ese Array va a ser transformado en JSON para poder ser recibido por el archivo de Javascript.

Por último el archivo de Javascript, va a recibir esa información.


success / .done() → Nos permite recibir la respuesta y procesarla.

error / .catch() → Nos permite manejar errores y procesarlos.

Rest api https://developer.wordpress.org/rest-api/ 

Qué son y cómo funcionan los endpoints? en la API

Es una Url que nos permite personalizar y expandir las capacidades de la REST API de Wordpress, esto quiere decir que nos dará una nueva url que nos va a proveer datos personalizados.


Wordpress nos provee una función para generarlo:


register_rest_route() → Cada endpoint debe ser registrado para empezar a funcionar. Para su registro recibe 3 parámetros

$namespace → reemplaza el wp-b2 (por defecto de WP), espacio de trabajo para todas nuestras rutas personalizadas.

$route → el resto de los parámetros que queremos recibir en esa URL.

$args → Para indicar el método como se pueden conectar a nuestro url y función de callback que procesa la petición y da el retorno de los datos.

$override → que es opcional, permite definir si la función reemplaza a otras si tiene la misma ruta.



Blogs Colombia