Instalación del navegador y sus DevTools

Para actualizar en sistemas operativos basados en Arch linux el comando para actualizar e instalar actualizaciones es

sudo pacman -Syyu

Si tienen distribusiones basadas en Arch como manjaro pueden usar un manejador de paquetes llamado yay

yay -Syyua

Para actualizar repositorios y aplicar las actualizaciones desde la terminal de Linux ejecutas lo siguiente:

sudo apt update
sudp apt upgrade

Linux es para mi el mejor sistema operativo para desarollo en general.

Yo uso Manjaro, y tiene la combinación perfecta de rapidez y un excelente package manager con un excelente ambiente para beginners.

Solo es aprenderlo a utilizar, y ya despues todo es diversion.

Si quieren actualizar su sistema operativo de manera mas facil desde la consola pueden usar el siguiente comando
sudo apt update && sudo apt upgrade -y

Con esto van a actualizar e instalar y la bandera -y es para que acepte las actualizaciones de manera automática

Si tuviste problemas en la instalación lo puedes hacer desde la terminal :
---- > sudo wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb

----- >sudo dpkg -i google-chrome-stable_current_amd64.deb

Considero que deberían mostrar otras opciones como chromium o Brave, versiones abiertas de chrome, el último respeta tu privacidad y tiene su propia criptomoneda. Acá les muestro que tiene las mismas DevTools (tal vez no lo hacen por negocios con google c(: )

para actualizar el sistema por linea de comandos se puede utilizar estos comandos

sudo apt update && apt upgrade -y

o tambien se puede remplazar el ultimo comando con

aptitude safe-upgrade

el comando safe-upgrade es un flag que descarga las actualizaciones que no hacen conflicto con lo que tienes actualmente instalado y busca resolver dependencias nuevas de paquetes sin crear conflictos con algunas ependencias existentes.

La gestión de dependencias de paquetes es algo que suele dar dolores de cabeza cuando se tiene un sistema linux instalado y no se han hecho actualizaciones por mucho tiempo y aunque no es muy seguido a veces puede suceder que algun paquete instalado se haya remplazado por uno mas nuevo y al hacer esto algun otro paquete que depende del anterior no pueda funcionar bien, es por ello que el comando safe-upgrade es util ya que si actualizas normalmente y hay un paquete en conflicto el programa de actualización desinstalará ese paquete en conflicto y si ese paquete quee se desinstalo era necesario para otro puedes terinar desinstalando una gran cantidad de paquetes de tu sistema operativo.

Mi recomendación es tratar de actualizar el sistema minimo cada 15 dias o si lo prefieres puedes hacerlo semanalmente, al hacerlo asi primero son menos la cantidad de paquetes que descargas y por ende menos te conectaras a internet y tendras tu sistema mas optmo

Me falto un poquito sobre que extensiones de Google Chrome recomienda instalar, pero me voy tranquilo al siguiente tema…

El curso de chrome dev tools

Les recomiendo Brave como navegador principal. Esta basado en Google Chrome y tiene los mismos DevTools. Lo bueno de Brave es que cuida bastante de tu privacidad y tiene un buenísimo AdBlocker instalado por defecto

Instalación del navegador

• En la interfaz de Linux dale en abrir el menú de aplicaciones y pones en el buscador “actualizaciones”. Si hay actualizaciones disponibles, instalas.
• Abre el navegador de Firefox
• Ve a esta dirección https://www.google.com/intl/es-419/chrome/
• Descarga Google Chrome .deb que es para Ubuntu
• Abrimos el archivo descargado e instalamos Chrome
• Abrimos el menú de aplicaciones y abrimos Google Chrome
• Lo establecemos como navegador predeterminado

Yo lo hago usando la terminal con GNU Wget
Wget:
es una herramienta libre que permite la descarga de contenidos desde servidores web de una forma simple.

https://es.wikipedia.org/wiki/GNU_Wget

1) 

Ctrl + Alt + T // Este comando abrirá tu terminal 

2) 

For Google Chrome 32-bit version
wget https://dl.google.com/linux/direct/google-chrome-stable_current_i386.deb

For Google Chrome 64-bit version
wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb

3) 

For Google Chrome 32-bit version
sudo apt install ./google-chrome-stable_current_i386.deb

For Google Chrome 64-bit version
sudo apt install ./google-chrome-stable_current_amd64.deb

Yo he tenido bastante malas experiencias con chrome y ubuntu. Se me tildaba a cada rato en una máquina nueva con procesador i9, 32GB de ram y SSD NVME y la maquina solo la usaba para escribir codigo en sublime. Se me solucionó al cambiar chrome por chromium. Lo comento por si alguien llegase a tener el mismo problema.

sudo apt install ./google-chrome-stable_current_amd64.deb

Si lo quieren instalar por consola

Durante el proceso de instalación de Chrome tuve dificultades, porque la descarga desde Firefox generaba un archivo de menor tamaño que alojaba en una carpeta diferente a “Descargas”. Sólo pude resolver este inconveniente, utilizando la terminal para la descarga e instalación.
Además al emplear la terminal para la descarga, utilizó la ubicación “carpeta personal” para alojar la información y el tamaño aumentó. Espero que esta información resulte de utilidad para aquellos que tengan inconvenientes con este proceso.

Yo me instale hasta las versiones Dev

Excelente, anteriormente lo instalaba por terminal pero esta opción es mas sencilla (Y)

Instalación del navegador y sus DevTools

Antes de instalar el navegador, debemos actualizar nuestro sistema por medio del menú de aplicaciones. Esto lo hacemos para tener las versiones más estables de las aplicaciones en el sistema.
.

Instalación de Google Chrome Dev

• Iniciar nuestro navegador por defecto que en Ubuntu es Firefox.
• En la barrad de búsqueda, buscar Google Chrome Dev.
• Accedemos a la página de descarga y descargamos el instalador.
• Cuando termine la descarga, nos dirigimos a la carpeta donde se guardo e instalador y lo abrimos.
• Se abrirá el instalador de aplicaciones de Ubuntu. Damos clic en instalar y esperamos a que finalice.

.

Uso de las DevTools

Las DevTool, son herramientas creadas para que los desarrolladores de software puedan obtener datos en tiempo real sobre sus proyectos web mediante el navegador.
.
Estas herramientas están incorporadas en muchos navegadores como Chrome, Edge, Mozilla, Safari, etc. Para acceder a ellas, debemos dar clic en los tres puntos de la parte superior derecha de nuestro navegador, luego en más herramientas y, por último, dar clic en Herramientas para Desarrollador. También puedes acceder mediante el atajo Ctrl+Shift+i.

pasos para instalar brave en ubuntu

1( control + alt +t

2( sudo apt install apt-transport-https curl

3( sudo curl -fsSLo /usr/share/keyrings/brave-browser-beta-archive-keyring.gpg https://brave-browser-apt-beta.s3.brave.com/brave-browser-beta-archive-keyring.gpg
4( echo “deb [signed-by=/usr/share/keyrings/brave-browser-beta-archive-keyring.gpg arch=amd64] https://brave-browser-apt-beta.s3.brave.com/ stable main”|sudo tee /etc/apt/sources.list.d/brave-browser-beta.list
5( sudo apt update
6( sudo apt install brave-browser-beta

No necesariamente tienes que instalar Chrome para probar tu software, también puedes usar Brave Browser que es una opción libre creada por el mismo sujeto que hizo Firefox, ya que a fin de cuentas el chiste de instalar Chrome es instalar tener un navegador que corra sobre la dependencia de Chromium

Para quien quiera intalar Brave desde la Terminal:

1. sudo apt install apt-transport-https curl

2. sudo curl -fsSLo /usr/share/keyrings/brave-browser-archive-keyring.gpg https://brave-browser-apt-release.s3.brave.com/brave-browser-archive-keyring.gpg

3. echo “deb [signed-by=/usr/share/keyrings/brave-browser-archive-keyring.gpg arch=amd64] https://brave-browser-apt-release.s3.brave.com/ stable main”|sudo tee /etc/apt/sources.list.d/brave-browser-release.list

4. sudo apt update

5. sudo apt install brave-browser

Para evitar el error de Firefox al momento de instalar Google Chrome, no marquen la casilla de instalación cuando les pregunta “Que desea hacer con este archivo”. Solo guárdenlo, ir a descargas y proceder con el instalador por defecto de Ubuntu

Agregando, cuando instalas un sistema operativo GNU/Linux lo primero que debes hacer es actualizar sus paquetes, ya que a diferencia de Windows la actualización no es automática. Para hacerlo podés usar

En Debian, Ubuntu y derivados:

sudo apt update && sudo apt upgrade

Para RHEL, CentOS, Fedora:

sudo dnf update && sudo dnf upgrade

Si usas una versión antigua o no tienes DNF Instalado debes usar:

sudo yum update && sudo yum upgrade

Listo, Brave instalado.

DevTools es un conjunto de herramientas de desarrollo web incluidas en los navegadores modernos, como Google Chrome, Mozilla Firefox, Microsoft Edge y Safari. Estas herramientas proporcionan una interfaz para inspeccionar y depurar el código HTML, CSS y JavaScript de una página web. Los desarrolladores pueden usar DevTools para ver el código fuente, ver cambios en tiempo real, depurar problemas de rendimiento, hacer pruebas de diseño y optimizar el rendimiento de la página. También ofrecen herramientas para depurar problemas de JavaScript, ver las solicitudes de red y el almacenamiento de cookies, y ver información de rendimiento.

Les recomiendo que cuando instalen la maquina virtual con Ubuntu le den al menos 40g de memoria, visto que con las actualizaciones y las dercargas de las aplicaciones no te queda espacio luego. Me toco reinstalar todo de nuevo para poder darle mas memoria y poder seguir el curso.

Clase 6 – Instalación del navegador y sus DevTools

¿Cómo podemos actualizar nuestro Ubuntu?

• Vamos al menú de aplicaciones.
• En la barra de búsqueda escribimos actualizaciones.
• En la ventana emergente damos clic al botón “Instalar ahora”.

¿Por qué deberíamos de actualizar nuestro Ubuntu?

• Porque así tendremos versiones de Ubuntu más estables que las que vienen por defecto en la instalación.

¿Cómo podemos instalar Google Chrome en Ubuntu?

• Nos dirigimos al navegador por defecto que tiene Ubuntu.
• En la barra de búsqueda realizamos la búsqueda “Google Chrome”
• Damos clic en el resultado que diga Navegador web Google Chrome.
• Le damos clic al botón descargar y seleccionamos la versión .deb de 64 bits.
• Abrimos la carpeta de ubicación en la que se descargó el instalador .deb.
• Damos doble clic al instalador.
• Damos clic en el botón Instalar de la tienda de Ubuntu de Software.
• Ingresamos nuestra contraseña.
• Verificamos que se haya instalado Google Chrome

¿Cuál es el navegador que tiene por defecto Ubuntu?

• Firefox.

¿La extensión .deb la encontraremos en la mayoría de paquetes destinados al uso de Ubuntu?

• Sí.

¿Qué se nos abre cuando damos doble clic al instalador de Google Chrome?

• La tienda de Ubuntu de Software.

¿Qué es la tienda de Ubuntu de Software?

• Es el instalador por defecto de software de Ubuntu.

¿Cómo podemos asegurarnos que se instaló Google Chrome en Ubuntu?

• Vamos al menú de aplicaciones y los buscamos con su nombre.

¿Deberíamos de establecer a Google Chrome como nuestro navegador predeterminado?

• Sí.

¿Cómo podemos cambiar el navegador predeterminado en Ubuntu?

• Menú de aplicaciones
• Buscamos Aplicaciones predeterminadas y la abrimos.
• En el formulario web cambiamos al navegador que queremos volver predeterminado.

¿Cómo podemos abrir las DevTools en Google Chome?

• Clic derecho y damos clic en la opción “Inspeccionar”.

Listo

Instalé el 22.04 y me indicaba que quedaria con 8 paquetes retenidos al actualizar…
Solución:
https://www.zeppelinux.es/apt-upgrade-los-siguientes-paquetes-se-han-retenido/

yo instalé chromium, y me fué bien

Los paquetes .deb que se instalan en ubuntu con paquetes Debian porque es la distrubucion en la que se basa ubuntu, pero ademas hay otra forma de instalar paquetes que con a traves de snap (https://snapcraft.io/store que tengo entendido funciona en todas las distribuciones Debian). La forma de instalar o la herramienta que se usa depende de la distribucion principal en la que se basa la que usemos.

INSPECIONAR = F12 o Ctrl + Shift + I

En fedora
Instalar los repositorios extras:
sudo dnf install fedora-workstation-repositories

Habilitar repositorio de google-chrome:
sudo dnf config-manager --set-enabled google-chrome

Finalmente para instalar el navegador solo tecleamos:
sudo dnf install google-chrome-stable -y

O para instalar la versión beta y la versión inestable.
sudo dnf install google-chrome-beta -y
sudo dnf instalar google-chrome-unstable -y

Uff ya quiero instalar editor de código

wget -c https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb
sudo apt-get install libappindicator1
sudo dpkg -i google-chrome-stable_current_amd64.deb

sudo apt-get install libappindicator1 Sirve para descargar librerías y poder ver el icono de google chrome

para los estudiantes como yo que el instalador por defecto no dejo instalar Google Chrome encontré un tutorial donde se instala y se utiliza otro instalador de programas en Ubuntu

https://www.youtube.com/watch?v=SjENS-mbJNE

a mi me sirvió espero que les sirva a ustedes 😃

si después de descargar google crome desde fire fox no les deja instalar miren el vídeo para q lo instalen desde la terminal https://www.youtube.com/watch?v=YAFtzINWNyg

sudo apt upgrade && sudo apt update, para ir familiarizandose con las actualizaciones desde la terminal

recomiendas instalar Chrome desde tu moxilla por medio de tu duckduckgo? baia baia baia jaja mentira, pero en mi caso preferi descargar brave.

Para actualizar en Fedora/CentOS/RedHat es:
sudo dnf update -y

tambien:
sudo yum update -y

saludos

¡¡Una explicación sencilla y práctica!!

No estoy seguro de porqué menciona que se instala Chrome y DevTools si en realidad se está instalando la versión estable pero de cualquier forma ya tengo la versión Dev de Firefox y Chrome.

He usado google chrome en todos mis estudios de Platzi, más adelante he de probar Firefox y Brave, aunque los que estan basados en Chromium son basicamente iguales

Que es DevTools?

Instalación del navegador y sus DevTools 6/17

• Extensión .dev para paquetes de Ubuntu
• Se descarga, se ejecuta el archivo con doble clic, se abre la tienda de Ubuntu Software y se instala
• Se puede establecer como navegador predeterminado en Settings → Default Applications
• Con clic derecho → Inspect Podemos ver DevTools

Mi computador literalmente era una papa. Y linux lite lo convirtio en una maquina para desarrollo 😄

sudo apt install google-chrome-stable

Para poder instalarlo desde la terminal 😄 a mi se me hace mas facil 😃

Las extensiones de Chrome también soy muy útiles para el desarrollo, utilizo ColorZilla para tomar colores en rgb de los sitios web y también React Dev Tools ára desarrollo

Entendido

Para empezar en el mundo de Linux, compré una Raspberry Pi 4 y he amado este primer acercamiento a este OS. La distro de Debian que trae, viene por defecto con Chromium y es igual al de Google. Si quieren ensayar consola, instalar algunas distros y dañar el OS, una Raspberry es una buena opción XD

El Chrome DevTools (Inspector de elementos por sus siglas en inglés) es una herramienta de desarrollo integrada en el buscador de Chrome para diagnosticar posibles problemas o errores. También permite testear las modificaciones mínimas para ser visualizadas en pantalla en tiempo real.

Para utilizar DevTools, haz clic con el botón derecho en cualquier parte de la página y seleccionar “inspeccionar elemento”. Se abrirá un panel completamente nuevo en tu navegador que muestra todos los activos utilizados en esa página.

Instalamos unas dependecias
sudo pacman -S base-devel
Sudo pacman -Sy
sudo pacman -Sy git

Instalando el programa

buscar en google el programa que deseas instalar 
![web.png](https://static.platzi.com/media/user_upload/web-524e4c71-ee01-4e77-a934-9e2b95d52b5d.jpg)

git clone clonar el programa en la pagina web que entremos nos dara el link a clonar
https://aur.archlinux.org/visual-studio-code-bin.git 

![git.png](https://static.platzi.com/media/user_upload/git-b2168109-a757-4224-ace7-55aacb5d54e5.jpg)

entrar a la carpeta que se clono por ejemplo visual-studio-code
dentro de la carpeta ejecutar  makepkg -s

ejecutar este comando 
nota: si instalaras otros programas simplemente mira la extencion del archivo pkg.tar.zst

sudo pacman -U visual-studio-code-bin-1.52.1-1-x86_64.pkg.tar.zst

actualizar
sudo pacman -Syyu

muy bien explicado el video

Les recomiendo Ubuntu, Fedora es muy sensible a cambios en librerias o instalaciones van tardar horas en arreglarlo, si eres nuevo en linux mejor no te metas en Archi linux es para personas que ya tienen suficientes conocimientos en linux. Mejor usen Ubuntu si quieren estabilidad, compatibilidad y soporte. “No me importa que se enojen los de fedora” es la verdad fedora se esta quedando atras en soporte y estabilidad.

Gracias!

DevTools