Как писать десктопные приложения на JavaScript, Electron, Node.js
ฝัง
- เผยแพร่เมื่อ 11 เม.ย. 2023
- Сегодня покажу вам как разрабатывать десктопные приложения на JavaScript с помощью фреймворка Electron под различные операционные системы будь-то Windows, MacOs или Linux.
Для работы нам понадобится VS Code и Node.js. В результате создадим простое приложение - "Калькулятор".
Иконка приложения:
www.flaticon.com/free-icon/ca...
Код урока:
github.com/ateros-lab/calc
#desktop #приложение #javascript #electron #nodejs #программированиеснуля #урокидляначинающих #js #html #css
Сборка приложения:
В любом месте на компьютере (например на рабочем столе), создайте новую папку Calc и откройте ее в VS Code. В терминале введите следующую команду:
npm init electron-app
Дождитесь пока завершится создание нового проекта, а после - удалите содержимое папки src и вместо него подставьте содержимое папки src из нашего проекта.
После этого в терминале введите команду:
npm run make
Когда работа команды завершится, в папке out вы найдете установочный и исполняемый файлы приложения для вашей операционной системы.
✔ Locating custom template: "base"
✖ Command failed: git init
'git' is not recognized as an internal or external command,
operable program or batch file.
Kak eto reshit'? Spasibo!
Installed GIT! Fixed!
Спасибо, Хороший урок! Побольше бы уроков electron js, подписываюсь , надеясь на эти уроки
Классная подача👍 Благодарю!
Спасибо 🙏 Рад, что вам понравилось)
ппц как такое могло случиться что я наткнулся на этот канал только сейчас? Однозначно подписка
Спасибо большое 🔥🔥🙏 Рад, что вам понравился мой канал) 🙏
Спасибо за урок! С этого урока я начинаю изучать Js electron ❤
И вам спасибо 🙏 Рад, что смог вас заинтересовать)
Видео топ, хотелось бы больше видео про Electron
Спасибо большое🙏
Хорошо)
ОЧЕНЬ КРУТО ПОДОБНОГО Я И ЖДАЛ ТЫ ОТЛИЧНЫЙ МОТИВАТОР СПАСИБО ОГРОМНОЕ ПОЖАЛУСТА ПРОДАЛЖАЙ
Спасибо большое, мне очень приятно 🔥🔥🙏
спасибо Вам!
Желаю Вам много подписчиков!)
Спасибо большое) 🔥🙏🙏
Было очень полезно и познавательно, спасибо
Рад, что вам понравилось 🙏🙏
Воу вообще топ! Я только собрался делать пет-проект на электрон! Давай пожалуйста еще про электрон сделай видосы! Какие там есть фичи и как у себя их использовать например. Как взаимодействовать с операционкой, ну с виндой допустим. Как лучше организовать файлы в проекте. Как туда затянуть реакт какой-нибудь. Так много вопросов у меня))
Спасибо большое 🙏🙏
Хорошо, постараюсь еще по электрону записать 😉
ОООО! Прикольно ! Спасибо, друже ! Давай ИСЧО такого ) десктопы на React + Electron !!! Например какой-нить файловый менеджер. А я за это отпишусь и снова подпишусь, а потом ещё раз лайк поставлю )))
Кстати, а что можно вместо eval использовать ?
Спасибо большое) 🙏
Возьму на заметку, что вам интересна эта тема 😉
"Кстати, а что можно вместо eval использовать ?" - Написать свою функцию, которая будет парсить строку и выполнять соответствующие действия.
я бы перед вызовом ивала провалидировал строку на предмет, что там только цыфры и операции
Сейчас для новых проектов лучше Таури выбирать, а не Электрон...
Возможно когда-то запишу и по нему тоже урок 😉
ИМХО Tauri ничем не хуже, а местами даже и лучше
Надо будет потом записать по нему тоже урок 😉
Ни чего не понятно, но очень интересно))) после команды npm run start выдал ошибку
C:\Users\User>npm run start
npm ERR! Missing script: "start"
npm ERR!
npm ERR! Did you mean one of these?
npm ERR! npm star # Mark your favorite packages
npm ERR! npm stars # View packages marked as favorites
npm ERR!
npm ERR! To see a list of scripts, run:
npm ERR! npm run
npm ERR! A complete log of this run can be found in: C:\Users\User\AppData\Local
pm-cache\_logs\2023-09-18T08_25_59_631Z-debug-0.log
А так все хорошом начиналось))))))))))
Здрастуйте. Скачайте репозиторий проекта по ссылке в описании ("Код урока") и запустите команду 'npm i', а после 'npm start'. Если все работает, попробуйте сравнить код моего проекта с вашим (скорее всего ошибка в файле package.json).
Спасибо за ответ. Скачал Код Урока и все запустилось. Я так понемаю из-за отсуствие папки package.json-lock , была проблема@@_ateros
Я рад что все получилось 🙏 Там скоре всего в другом месте была проблема. Ничего страшного, пока-что тренируйтесь писать проект в этой папке (просто переписывая index.js/index.html).
Потом можете подробнее почитать о том как работает npm и package.json, это поможет вам лучше понять и определить проблему.