Convierte sitios web en Aplicaciones de Escritorio con Nativefier
HTML-код
- Опубликовано: 7 авг 2022
- Nativefier es un comando de npm que puedes instalar usando Nodejs, y el cual te permite crear aplicaciones de escritorio a partir de un sitio web desplgado, de hecho lo que hace es que te permite colocar un sitio web en un contenedor de Chromium (creado en Electron), lo que en la practica significa que puedes convertir tu aplicacion web con un solo comando en una aplicacion de escritorio con tecnologia web.
Este no es un framework sino un simple programa de npm:
github.com/nativefier/nativefier
🎥 Videos Recomendados:
Github Pages npm ➜ • Github Pages | Sitios ...
Mongodb Visual Studio Code ➜ • Mongodb para Visual St...
Mongoose ➜ • Mongoose | Introduccci...
Curso de Nodejs ➜ • Nodejs Curso Desde Cer...
Thunder Client ➜ • Thunder Client - Postm...
Variables de Entorno en Nodejs ➜ • Variables de Entorno e...
Curso de Git ➜ • Git y Github | Curso P...
Rest client VSCode ➜ • Rest Client | Extensio...
Mongodb Atlas ➜ • MongoDB Atlas, NoSQL e...
👨💻 ¿Qué servicios y productos utilizo?
Ledger (Hardware Wallet) ➞ bit.ly/3ijsVNW
SiteGround ➞ bit.ly/31u9ZEk
DigitalOcean ➞ m.do.co/c/8ef261d77de5
Expo ➞ bit.ly/2WpYKtx
Cloudinary ➞ bit.ly/3ohNlJ7
Namecheap ➞ namecheap.pxf.io/ErDe9
#electron #desarrolloweb #javascript 
Наука
Fatz, no conocía tu página y la verdad tiene un acabado muy limpio, felicidades!
Gracias por todo tus aportes y excelente forma como explica en todo los videos. son de gran ayuda
Bro buenisima esa herramienta si que puede sacar de un apuro, se agradece!!
Muchas gracias bro, justo lo que necesitaba.
impresionante nativefier! :D Muchas gracias Fat
Gracias por la información. 👍
Super útil, tengo mucho tiempo esperando un vídeo cómo esto!!
Hola, Fazt, me gusta el nuevo logo del canal
Excelente aporte y video muchas gracias
Una pregunta, ¿Hay una función que permita guardar el usuario y contraseña una vez inicia sesión?
Excelente aporte.
Maestro de maestros.
it worked! thank you so much!!
Sería bueno que realizara un video de como se un programa para instalar con esta opción que explicas en este video 😊
Hola Fazt gracias por tus aportes, una pregunta, crees que Microsoft store acepte una app con Nativefier?
Profe excelente video como siempre, pregunta: es un webview o descarga el sitio completo?
Como siempre, directo al punto, felicitaciones, tengo una pregunta,
Como puedo empaquetar para hacer un instalador para windows 10?
Un fuerte abrazo, tienes todo lo que se requiere para ser un ink master, sigue adelante.
Muchas gracias!
Y se podria integrar el .exe con un proyecto rasberry como proyecto fisico con la idea por ejemplo de una especie de miniconsola con ese programa descargado?
Gracias crack!
Muy súper, quiero saber si puedo hacer lo mismo pero para convertir de web a app de Android y iOS. O principalmente android, gracias... Saludos!
Muy buen video tutorial amigo, pero disculpa en la parte de la documentación donde puedo buscar que apareszan las flechas de regresar, avanzar y recargar la página, es que no me aparecen, gracias y suerte.
Master 🤯
Hola saludos tengo una duda si hago eso con mi pagina wed cada actualización que yo haga o cada cosa que suba se actualizaría también allí en la aplicación de escritorio?
Te hago una consulta, yo quiero modificar un juego web para añadirle cosas pero no estaria sabiendo donde y como hacerlo, tienes un video sobre ello? Podrias explicarme?
Hola que tal? Que comando puedo usar para que me permita ventanas emergentes de mi pagina web??
Si creo mi app del sitio de Fazt con Nativefier y luego Fazt sube una actualización al sitio, mi app tendrá esa actualización o tendré que crear una nueva? :O
Se puede usar para una aplicacion que no esta desplegada!? Que tengo en local!? Para empaquetarla de manera rapida!?
Hola es posible realizar esto mismo, pero con algún sitio web en código nativo?
Hola alguien lo probo?, en mi caso lo hago desde una aplicación hecha con react, en ubuntu va perfecto, pero en windows surge un problema, la aplicacion muestra algunos alert con mensajes para el usuario pero luego de dar aceptar la interfaz pierde el foco y no recibe nada desde teclado en los inputs a menos q la minimize y la maximize algo muy molesto.
Si mi aplicación web la tengo local puedo hacer la conversion de todos modos?
Hola amigo! ¿Se podría personalizar lo que se ve dentro de la web con esto? es decir bloquear algunas secciones, limitar accesos, personalizar imágenes.
es posible configurar el puerto? eej: locahost:3002 etc
perdon por la ignorancia pero no queda igual que en el navegador google ir a crear acceso directo y activar ejecutar en ventana?
Buenas noches líder, he realizado estás acciones para convertir una web de gestión de ventas en la que debo iniciar sección, pero cuando voy a iniciar me envía a la web al ingresar los datos me da error y no me abre en la app creada, ¿Que hago?
una pregunta como serviria para varia url en si multaneo mosea que te coja tres url y te aga de las 3 en una
FAZT podrás crear un Crud expo-sqlite ??
buenas, no conozco nada sobre lenguaje queria saber si podia convertir una web (ya no actualiza contenido) como una aplicacion para poder visualizarla offline, si bien conozco el metodo de cualquier navegador "clic derecho> guardar pagina" quiero darle una mejora para que resulte mas "compacta" es decir solo debo ingresar a un .exe y no a una carpeta para acceder a ella. espero que se entienda. gracias
Podrias hacer una para movil.
Bien , primer comentario , gracias por el video fazt , un saludo !
Hola Fazt pues espero tu respuesta, por qué no puedo iniciar seccion luego de convertir una web en weapp, osea si la pagina requieres de un inicio se sección no me lo permite y me redirige a una web y luego me da error, ¿Que puedo hacer?
Esto puede funcionar con una página creada de manera local?
tengo instalado nodejs y toda esa onda pero al momento de abrir la app solo parpadea pero se queda en gris! ayuda porfa
y se puede convertir una aplicacion de escritorio a web ?
Nice, Por cierto, aprovecho que mencionas electron para preguntar algo y es que hace un tiempo vi una discusión en un foro de Linux que decían que no recomiendan usar programas creados electron, ya que consume mucho. Es realmente cierto o es una exageración?
Ese tema siempre se menciona porque electrón como se ejecuta dentro de un navegador de chromium, tiende a consumir mucha ram si no se optimiza, pero esto es así por el diseño de chromium. Al día de hoy hay aplicaciones que están muy bien optimizadas, como vscode y que manejan bien el uso de recursos por lo general. Aunque si se compara con native el código nativo siempre será más rápido. El problema es la experiencia de desarrollo, en nativo tienes que desarrollar todo desde cero, mientras que en web ya tienes módulos y apis del navegador que ya te dan prácticamente todo hecho, como reconocimiento de voz, comunicación en tiempo real, y la interfaz puede ser con tu framework favorito. Es al final elegir rendimiento o Experiencia de desarrollo
Quiero hacer uno con arquitectura x32bits me pueden ayudar no medeja.
puedo usar esto pero con una pagina que tengo en local?
Y si necesito usar una variable de entorno?
Interesante... 🤔
Intenta hacer un video con djando mongo un crud estaba yo intentado pero me dice q el motor de mongo no esta disponible en djando busque muchas ayuda y ninguna funciono
Se puede hacer con un localhost?
Hola, estoy creando un juego en Html y JS, esto podría funcionar para hacer ese juego offline? O debería trabajar primero con manifest y con pwa para luego convertirlo a ejecutable?? Gracias de antemano
Si pusiste hacerlo? tambien ando batallando con eso
Gracias fazt, que tecnologías utilizaste para tu web?
Mi web usa Nextjs, Mongodb, GraphQL, Typescript :)
Y de escritorio a web?
Gracias, como herramienta no está mal la verdad, El WhatsApp Web me va 1000 veces más rápido que la aplicación nativa.
Enséñenos cómo recibir notificaciones de estas aplicaciones en el escritorio, por favor!
Hola Fazt.. me sale este mensaje cuando ejecuto el exe.. "No se encuentra el punto de entrada del procedimento Discard\VirtuaMemory en la biblioteca de vínculos dínamicos C:\User\asus\desktop\Google-vin32-x64\Google.exe".... Tengo instalado el Visual C++ Redistributable para Visual Studio 2015 14.0.23026
bro estaba empezando aprender React, pero me entro una duda, que recomiendas tu aprender primero Nodejs, Angular o React ?
Personalmente te recomendaria aprender Nodejs primero y luego React. Porque este ultimo usa muchos conceptos y herramientas de Nodejs que tarde o temprano te encontraras.
Yo usé ese módulo hace un tiempo jaja, lo único que me disgustó de ello es el hecho de que no tiene botones de regresar o recargar la página, a mi punto de vista eso es muy útil, por lo demás me parece algo más profesional o estético para una web.
Los botones de la ventana están ocultos, si quieres mostrarles tienes que usar la tecla Alt, en view están esas opciones que dices.
Puedes hacer un video de como empaquetar todo y añadir un instalador?
Este proyecto actualmente ha sido archivado, por lo que ahora la unica opcion para poder crear apps de escritorio es usando Electron o Tauri
ruclips.net/video/RQyJ3avifSQ/видео.html
github.com/nativefier/nativefier
me sale el error de
56 packages are looking for funding
run `npm fund` for details
Yo quiero hacer algo similar pero en viceversa quiero convertir mi software a web
Está muy bueno, pero no me deja iniciar seción con mí cuenta de Google en la web que convertí con esto.
Funcionará con app creadas con React también? Supongo que primero debería subirla a un servidor
Si no la quieres subir podrías probar con esto ruclips.net/video/W5mXG3n2YmM/видео.html
ORO
"npm" no se reconoce como un comando interno o externo,
programa o archivo por lotes ejecutable. alguna solucion?
Para poder utilizar npm es necesario tener instalado node.js
como seria si la apppweb está protegida con un login?, los componentes que están despues del login no los empaqueta? o simplemente no funciana?
Si lo notas lo unico que hace la herramienta es colocar un sitio desplegado dentro de un navegador, asi que a partir de alli, cualquier ruta protegida, o pagina es lo mismo.
Espectacular el video pero creo que NativeFier quedo sin mantenimiento desde Sep-2023 en github
Hola fazt :D.
Una preguntita :'3
Hay forma de poder crear interfaces así en aplicaciones de escritorio pero sin herramientas web?
Tengo entendido que así el rendimiento es mejor :' 3
Mira intenta con esto ruclips.net/video/W5mXG3n2YmM/видео.html
Sin embargo necesita de conexión a internet, hay alguna alternativa para que no sea necesaria la conexión?
en ese caso tendrias que desarrollar con algun framework tipo electron o similares.
@@FaztCodeMe podrías contestar esta pregunta. Ya que se esta ejecutando la aplicación desde el pc, pero funciona con la base de datos y la información de un hosting. La aplicación se consideraría hibrida?
es como hacer una spa embebida en un webview a partir de un sitio no?
asi es :)
Buen video, pero que diferencia tiene esto, de la posibilidad que ya tienen los navegadores, de permitir crear aplicaciones a partir de una página web como una opción del mismo navegador.
¿Podrías dar más detalles de esto por favor? No lo había oído antes.
@@elrafineitorxd5400 Claro, todos los navegadores basados en chromium permiten eso, puedes instalar un sitio web como una aplicación de escritorio. Te vas a los tres puntos donde se despliega el menú del navegador con opciones, te va a salir una opción que se llama como aplicaciones, y ahí sale un submenú, ahí te va a salir una opción que se llama instalar como aplicación, y listo, eso es todo.
a lo sumo se puede diferenciar en que la app que creas con electrón se vuelve independiente en cambio usando un navegador conviertes una web en una app haces que esa app sea una extensión del navegador, haciendo que si desinstalas el navegador no se pueda usar la app, según lo que entendí tu comentario.
@@honeyboy_dev Pero si usas electron, estas empaquetando la pagina en un navegador, y lo que digo yo, no es extension, es una web app como si fuera instalada. De igual forma si, que si quito el navegador, pero quien quitaria el navegadot
pero termina siendo un .exe no mas que abre el nav y va ala web no es asi?
Así es, es como colocar toda la web en un navegador y empaquetarlo. De hecho esto esta basado en electron, asi que lo unico que hace por asi decirlo es facilitarte empaquetar el proyecto y nada mas :)
Excelente
se podrá con una web que no este alojada?
En ese caso seria ir mejor por electron, esta herramienta usa electron solo que lo hace con sitios desplegados :)
@@FaztCode Muchas gracias
Si es un sitio web estática , funcionaria sin internet la app ?
Y cuando hagas búsqueda de Google sin internet te saldrá el Dinosaurio 🦖
Yo lo acabo de probar con mi app y me funciono sin internet
Debería funcionar sin problemas siempre y cuando no requiera ningun servidor backend
eso para mac?
Pra cualquier sistema era en realidad, pero el proyecto ya está desfasado así que ya no es una opción viable
Comunidad como están , ¿Alguien sabe empaquetar todos esos esos archivos en un solo ejecutable .exe? 😅
tiene otro canal de youtube?
Si amigo, son 2, este y ruclips.net/user/fazttech
:)
Espero me de respuestas por favor porque es importante
Lo único negativo q le veo es q no funciona offline, pero igual es muy útil en algunos escenarios. Sldos
Asi es, es un comando sencillo simplemente, si se requiere offline, estaria electron y similares :)
No funciona
Tienes algún error que te da la consola?
wails, wails, usa wails XD
👍
eso no es ilegal?
Por lo que tengo entendido funciona como un navegador web y solo accede a la url, asi que no veo la ilegalidad
para eso esta la licencia. Revisar el apartado de distribución.
Acaso estas hackeando el Pentágono?? Es casi que darle al menú del navegador y decir convertir en App de escritorio...
Muy buen video, excelente pero se puede hacer lo mismo en una aplicación app pls, saludos fazt salúdame. nice
y se puede convertir una aplicacion de escritorio a web ?