Aplicaciones de escritorio

A este curso vine buscando cobre y encontré oro. Tremendo

buckdevelopment

Muy buen curso, sencillo, limpio organizado y muy instructivo, una vez más reaprendiendo las herramientas que llevo usando mas de 3 años sin saber exactamente como funcionaban internamente!! Gracias Carlos!!

Luz Sthephany Granados Castro

💨⚡ Electron 💥💻

(conocido anteriormente como Atom Shell1) es un framework de código abierto creado por Cheng Zhao, y ahora desarrollado por GitHub. Permite el desarrollo de aplicaciones gráficas de escritorio usando componentes del lado del cliente y del servidor originalmente desarrolladas para aplicaciones web: Node.js del lado del servidor y Chromium como interfaz. Electron es el framework gráfico detrás de muchos proyectos de código abierto importantes, incluyendo a Atom de GitHub y Microsoft Visual Studio Code. Wikipedia
Aplicaciones que usan Electron: 💪 Visual Studio Code, Atom, Slack, WhatsApp, Skype, Twich, Signal, Github desktop.
👉 Desarrollando aplicaciones de escritorio con Electron.js

Jairo Lachira Peralta

https://github.com/electron-userland/electron-prebuilt/issues/260

Para los que estén usando WSL:

WSL no admite interfaces gráficas. La solución mas simple que encontré es configurar este script que lo que hace es instalar electron pero con los archivos binarios para Windows en lugar de los de UNIX, de esta manera al ejecutar la aplicación usará la interfaz grafica de Windows

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "electron .",
	//here
    "install-wsl": "npm install && npm uninstall electron && export npm_config_platform=win32 && npm install electron && unset npm_config_platform"
  }

Luego ejecutan:

npm run install-wsl

Y les debería arrancar

Fuente:

Ginnio Sarabia

Electron en 10 minutos. Que crack!

Captura de pantalla de 2020-05-17 02-20-12.png

Juan Sebastian Galvis Huertas

Dios!!, es como si loulogio impartiera clases de node, genial!!!

efrainjaimes

En DEFINITIVA, de los mejores cursos que he hecho en platzi, y de verdad que he hecho varios buenos. Felicidades a platzi por seleccionar profesores tan excelente.

Sebastian Rodriguez Marin

Excelente curso. Gracias Carlos! Eres el mejor. Me hubiera gustado un vistazo rápido a sockets pero no hay lió, estuvo excelente.

Francisco Garcia [C6]

woww, que paquente tan bueno.

<html>
    <head>
        <style>
            body {
                background: #333333;
                color: #ffffff;
            }
        </style>
    </head>
    <body>
        <h1>Soy una apliccion de escritorio</h1>
        <button>Super bonton</button>
    </body>
    
</html>

const { app, BrowserWindow } = require('electron');

let ventanaPrincipal;

app.on('ready', crearVentana);

function crearVentana() {
    ventanaPrincipal = new BrowserWindow({
        width: 800,
        height: 600,
    });

    ventanaPrincipal.loadFile('index.html');
}

santos juvenal quispe tapia

Excelente curso : link de los recursos
https://github.com/CodingCarlos/fundamentos-node-platzi

Beto Toro

si me encuentro este profesor en la calle, y ya estoy vacunado. Le voy a dar un abrazo. Que forma de entrarle al back tan espectacular.

Infinitas gracias profe 🙏🏼

Francisco Javier Antúnez Durán

// npm init -y
// npm i electron

const { app, BrowserWindow } = require('electron');

let mainWindow;

app.on('ready', createMainWindow);

function createMainWindow(){
    mainWindow = new BrowserWindow ({
        width: 800,
        height: 600,
    })

    mainWindow.loadFile('index.html')
}

JuanDanielRR

ajajaj que genial!

Carlos Enrique Ramírez Flores

Siempre crei que usar electron sería mas complicado, pero es mas facil de lo que imagine!!

Yoprog

Definitivamente este es el mejor curso para empezar a aprender node, ademas el profesor explica MUUUUUUUY BIEN, ¡gracias Carlos y Platzi por este magnifico curso!

Uriel Mojica Mejía

Esto es genial 1! Entonces cualquier app que desarrolle en ReactJS lo puedo convertir en una aplicación de escritorio?

Miguel Ángel Muñoz Pozos

Excelente curso es super genial todo lo mostrado en este curso. Veo que Node js es super potente

rubenchanamesanchez

El curso estuvo genial!!!

carSantello

Profe Platzi

Magnífico curso. Y las colaboraciones de los estudiantes y la comunidad, de maravilla, como ya es costumbre 💚

T-gold

GENTE QUE UDS QUE CREEN?
es preferible seguir con el curso de carlos de nodejs o con el de la escuela de js
de backend con nodejs??

Juan Carlos Valencia López

ni este ni la anterior me salio 😦

Keiler Delgado

Venía postergando electron porque pensaba que iba a ser muy complejo, y me voy super contento sabiendo que no lo es, un gran curso, no faltó nada!

Diego Camino

Me sale el siguiente error: The SUID sandbox helper binary was found, but is not configured correctly

Ya googlié sin embargo no consigo resolver, si alguien tiene la solución, soy todo oídos

T-gold

SERIA MUY COMPLEJO USAR ELECTRON PARA CONVERTIR PLATZIVIDEO EN UN APP DE ESCRITORIO?

nestor-alejandro-aguilar-munoz

Excelentes clases. ¿Alguien podria podria decirme donde encontrar informacion para que la aplicacion de escritorio se ejecute por medio de un click de mouse en lugar de abrirlo desde el simbolo del sistema?

Gabriel Alejandro Delgado Álvarez

Que curso tan genial. Este, el de fundamentos de Javascript y el de Python, son de lejos los mejores que he visto en platzi.

Luis Fernando Tirado Hernández

Hay otros cursos donde la última clase suele ser solo para despedirse y dar sus conclusiones. En este curso no es así, hasta la última clase nos enseñó algo valioso. Este es uno de los mejores cursos que he tomado. :3

Juan Araujo

Les comparto mis notas del curso hechas en Notion! Por si quieren repasar cualquier cosa vista en este curso de manera rápida en el futuro
https://www.notion.so/Fundamentos-de-Node-js-Platzi-114010b2144b46f199bce23c1a1844ef

Y si no usan Notion, es el momento perfecto para empezar!

JOSE GABRIEL CASTILLO MOSQUERA

En esta clase no logre que se me mostrara la ventana con los botones me sale así nomas

y me da este error

lo intente por powershell y me da este error

Gabriel Quevedo

Mi curso FAVORITO y he hecho muchísimos… que gran sujeto, que forma más amable de explicar contenidos, que podemos decir… más que un profesor, un MAESTRO. espero tener muchos cursos con este hombre!

Me voy feliz al examen ❤️

Joni Alejandro Alcalá


> electron-app@1.0.0 start /mnt/c/Users/Administrador/FundamentosNode/herramientas/electron
> electron .

/mnt/c/Users/Administrador/FundamentosNode/herramientas/electron/node_modules/electron/dist/electron: error while loading shared libraries: libXcursor.so.1: cannot open shared object file: No such file or directory
npm ERR! code ELIFECYCLE
npm ERR! syscall spawn
npm ERR! file sh
npm ERR! errno ENOENT
npm ERR! electron-app@1.0.0 start: `electron .`
npm ERR! spawn ENOENT
npm ERR! 
npm ERR! Failed at the electron-app@1.0.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/jonialcalaugaz/.npm/_logs/2020-05-04T22_23_20_887Z-debug.log```

me sale este error que hago?

Georgie Duarte

ahora si quiero aprender bien node jejje

Ramiro Nicolas DAccorso Rosati

EXCELENTE

wilantury

Wow, esto es genial, nunca me lo imaginé. Con Node - JavaScript puedo hacer todo. WEB-MOBILE-DESKTOP

Fabian Gutiérrez

hace 2 meses

Excelente curso, algo que le falta a platzi (al menos los cursos que he visto hasta ahora) es aplicaciones grandes reales, si bien tiene algunas practicas pequeñas de como se utilizan las cosas que estamos aprendiendo, hace falta una sección donde haya proyectos mas grandes, por ejemplo un blog entero, con un sistema de comentarios, imágenes, etc, pero no solo por encima, si no una pagina web entera, en mi opinión es lo único que le falta a platzi, sin embargo este curso me ha gustado bastante

Gilberto Pérez Garrido

hace un mes

No soy JavaScript lover, pero creo que se debería dar este lenguaje en las Universidades, en vez de hacer aplicaciones con Delphi o incluso C para Escritorio

Rodrigo Andrés Moreno Pertúz

Me gustó mucho esta clase!

Julian David Alzate Cuervo

Este curso es oro puro

Gabriel dev

hace 7 meses

desde calidad baja a lo leonidas hasta la máxima calidad por parte de Carlos Hernández, bienvenido a Platzi

Rodolfo Nicacio Ugalde Ochoa

A mi me dio problema electron. no lo pude correr, me salio este mensaje

electron_app
> electron .

[30894:0521/003031.051688:FATAL:setuid_sandbox_host.cc(158)] The SUID sandbox helper binary was found, but is not configured correctly. Rather than run without sandboxing I'm aborting now. You need to make sure that docs_fundamentos-node-platzi-master/herramientas/electron_app/node_modules/electron/dist/chrome-sandbox is owned by root and has mode 4755.

Y buscando una posible solución fue que en package.json se añadiera la linea

electron . --no-sandbox

Pero no funciona. Yo ocupo debian buster, alguien lo pudo solucionar?
Saludos

Wilmer Diaz

Desde mi lugar de estudio, de pie y un aplauso por el profesor que hace ver a node.js como lo mejor del mundo. MIL GRACIAS y que calidad de curso.

Cristobal Peña

Alguien podría compartir su código por favor? Estoy obteniendo un error y me gustaría saber si es por algo que estoy haciendo mal o es algo que no funciona bien en mi entorno de sistema. Gracias

Cristian Felix Iñiguez Porcel

me voy al curso de electron 🦾🦾🦾

Juan Esteban Galvis

Siento que ha sido de los mejores cursos que he tomado de TODO PLATZI!!! y eso que he tomado más de 100 cursos.

Me encanto y honestamente YA QUIERO APRENDER DE SCRAPING Y ELECTRON!

Los dos cursos que entonces seguiré serán:

Martin Paez

Fundamentos que te abren la puerta mundos. Tenia muy poco conocimiento de Node y me voy con muchas posibilidades en futuro. Grax

José Carlos Díaz

Dentro de mi Top 5 de cursos dentro de Platzi. Me lo he disfrutado muchísimo. Carlos es un excelente profesor, un gusto cada clase.

SANTIAGO GUÁQUETA ANGARITA

Este curso es increíble, una máquina para explicar, profundicé javascript, aprendí a hacer scraping y a crear una app de escritorio en un mismo curso. Increíble.

Jorge Fidel Zubieta Choque

hace 10 meses

Me voy con ganas de ufff seguir aprendindo!!! increible todo lo que podemos hacer con Node JS!!!

Carlos Enrique Gonzalez Peña

Recuerden, todo!!! haha, tambien con NodeJS podemos crear las famosas CLI (Command-line Interafce) O applicaciones de linea de comando, asi puedes crear scripts que ejecuten ciertas tareas y lazarlas automaticamente con algun task manager como el de windows.

Excelente curso!

Jorge A. Torres

WOWWOe, esta clase me gustó mucho

Alejandro Lopez Ramírez

https://github.com/CodingCarlos/fundamentos-node-platzi

Guadalupe Giovanni Hernández Medina

Es increíble el poder de Node y sus paquetes 💪

jorgeoxi

Excelente curso, muchas gracias al profesor Carlos por tremendos temas y recomendaciones!

Emanuel Alava

Uno de los mejores profesores!!!

Leandro Ariel Labiano Ramo

hace 10 días

Un curso realmente increible, el profe aun mas increible…

David Eduardo Perez Hernandez

hace 19 días

Increíble todo lo que se puede hacer gracias a un buen manejo de node, en este momento se que se me escapan las posibilidades tan inmensas que hay, pero me quedo contento sabiendo como debugear mejor, con ganas de aprender de scraping y de practicar mas el desarrollo de apps que sean tanto web como de escritorio. Muchisimas gracias!

Heric Darío Darío Condori Humerez

hace 20 días

Idolo

Leyny Beatriz Lima Bautista

hace un mes

Si tienen problemas a instalar pq está en otra unidad pueden usar el cmder que nos dieron en clases anteriores y desde ahí instalarlo en la carpeta electron sin ningún problema

Abraham Gonzalez

hace un mes

Excelente Profesor !! Grande!!

Hernández Yaneth

hace 3 meses

Este curso es fabuloso!!

Maico Beas

hace 3 meses

Muchas gracias por el curso

Francisco Javier Granados Silva

hace 4 meses

Para quienes usan WSL y tiene problemas para usar electron. Solo abran una terminal de powershell e instalen electron desde ahi, obviamente deberian tener instalada la version de windows de Nodejs

npm i electron

Si tiene problemas tambien pueden cambiar la linea start de la siguente forma

"scripts": {
    "start": "electron index.js",

Listo, deberian poder abrir la ventana desde wsl o powershell

Edward Fuentes

hace 5 meses

Es el mejor curso que he tomado, a pesar que esta desactualizado por el tiempo, la explicación es espectacular.

Jorge Luis Pausa Hernández

hace 5 meses

Excelente curso, que gran profesor Carlos!

Gamaliel Ceron Vitar

hace 5 meses

Eres una maquina, excelente curso!

Juan Camilo Cortes

![](

Yo si hize un poco mas organizado creando el index.css donde se le da maquetaccion y lo adjuntan al archivo html como lo pueden ver el codigo.

Juan Camilo Cortes

Que pedazo de curso que se lanzo Carlos,ufff te da unas muy buenas bases, este profesor aun sigue en Platzi?

Santiago Bastidas Rodríguez

Aplicaciones de escritorio

Módulo que vamos a utilizar

Electron

Instalación

npm i electron

Utilización

Lo primero que se debe hacer es importar el módulo ó las funciones que se quieren extraer del mismo.
```
const { app, BrowserWindow } = require('electron');
```
En este caso se extraen las funciones app y BrowserWindow .
Luego se crea una variable que va a recibir la instancia del objeto BrowserWindow .
```
let mainWindow;
```
Ahora se crea la función que va a permitir crear la ventana de la aplicación.
```
function createWindow() {
  mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
  });

  mainWindow.loadFile('index.html')
}
```
1. Lo primero que se hace dentro de la función es instanciar el objeto BrowserWindow dentro de la variable mainWindow , y se cargan valores a las propiedades width y height .
2. Se utiliza el método loadFile() para cargar el archivo que se va a mostrar en la ventana.

Por último en el packege.json se personaliza un script para poder ejecutar la aplicación.

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "electron ."
  }

El resultado de la aplicación en este caso es la siguiente:

Francisco Sarria

Acá pueden repasar y posiblemente ampliar los conocimientos básicos de Node.js:

https://nodejs.dev/learn

Ultra recomendable.

Alex Antonio Angulo Luna

Ameee este curso!

Andrés Felipe Lopez gomez

Que excelente curso mas de lo que pintaba el ttitulo del curso, y el profe es excelente.

Víctor Isaac Arias García

Muchas gracias por este genial curso aunque me queda mucho por aprender aun primera vez que veo como puede funcionar utilizar Node JS

Paula Melo

Este curso tiene los trucazos… ¡Excelente!

Mauricio Carrasco

Para los que no le funcione con wsl

Abran una nueva ventana en VSCode con ctrl + shift + n.
.
Abran un nuevo folder ⬇

.
Escojan un folder ubicado en windows o creen uno nuevo y listo 😄

Julio César Franco Castro

Excelente curso, me mantuvo atrapado en cada clase

Julian David Orozco Colorado

Excelente, este curso me abrio de nuevo el hambre por el desarrollo, muchas gracias profe Carlos.

Angel David Osorio Leyva

El curso estuvo increíble, al igual que todas las herramientas utilizadas.

Danilo Francisco Espinoza Pino

Q buen curso de fundamentos!, lo único que no hice fue usar los paquetes que requerían tener node-gyp instalados, pero me quedó el conocimiento igual

Jesus Alberto Garzon Castillo

que final tan increible y motivador, me abrio la mente con electron

Víctor Andrés Córdova Poma

El curso es muy bueno. Sin embargo, flojea en ciertos aspectos como en la clase de stream, donde falto más explicación sobre lo que se estuvo codeando.

Espero haya una actualización del curso, porque existen ciertos módulos que ya no son recomendados a usar y otros que no tienen mantenimiento desde hace 2 años(gulp)…

Carlos Hernandez

Gran curso y excelente profesor

Jeaneth Tafur Huaman

Estaba pensando rendirme… electron 🤯, regresare a continuar con el curso 😎

Jason Mateo Pineda Lopera

EPIC MOMENT!

Dani-Ideas

que se pueden hacer que… con que 🤯🤯🤯🤯🤯🤯🤯🤯🤯🤯🤯🤯🤯

Sergio Andrés Bolaños Penagos

Este profesor es una completa joya en Platzi, EXIJO MÁS CURSOS DE ÉL!!! JAJAJAJA

Diego Maestre