Electron และ Nativefier เพื่อสร้าง webapp ของคุณเองจาก Ubuntu

ในบทความวันนี้เราจะมาดู Electron การใช้งานนี้ กรอบการสร้างแอปพลิเคชัน ร่วมกับเครื่องมือที่เรียกว่า Nativefier จึงกลายเป็นโซลูชันสากลที่ แพ็กเกจแอปพลิเคชันเว็บสำหรับเดสก์ท็อป.

ในบล็อกเดียวกันนี้เราได้พูดคุยเกี่ยวกับบางกรณีของ เว็บแอพ. ในนั้นเรามีแอพพลิเคชั่นที่รู้จักเช่น เว็บแค็ตตาล็อก. นี่คือแคตตาล็อกที่กว้างขวางซึ่งเราจะพบแอปพลิเคชั่นจำนวนมากที่สร้างด้วย Electron ตัวอย่างเพิ่มเติมของสิ่งที่เราสามารถสร้างด้วยซอฟต์แวร์นี้ ได้แก่ แอปพลิเคชันเช่น Wmail, Skype, Simplenote, GitKraken หรือ Visual Studio Code

ในบางไซต์พวกเขากล่าวว่าปัจจุบันเราไม่ต้องการแอปพลิเคชันเนทีฟสำหรับ Linux อีกต่อไป อย่างที่ทุกคนทราบกันดีว่าเว็บมีหลายแพลตฟอร์มและนั่นคือสาเหตุที่แอปพลิเคชันโดยทั่วไปค่อยๆย้ายมาที่เว็บเป็นเวลาหลายปี

ตามที่พวกเขากล่าวไว้ใน เว็บไซต์หากผู้ใช้สามารถสร้างเว็บไซต์ได้ก็สามารถสร้างแอปพลิเคชันบนเดสก์ท็อปได้อย่างง่ายดาย อิเล็กตรอนคือก เฟรมเวิร์กสำหรับการสร้างแอปพลิเคชันเนทีฟด้วยเทคโนโลยีเว็บเช่น JavaScript, HTML และ CSS.

ขอบคุณสิ่งนี้ในการใช้เว็บแอปพลิเคชัน เราจะต้องใช้เว็บเบราว์เซอร์เท่านั้น. ทุกวันนี้เบราว์เซอร์ทั้งหมดรองรับคุณสมบัติต่างๆเช่นการจัดเก็บข้อมูลบนดิสก์หรือการแจ้งเตือน สิ่งเหล่านี้เป็นเรื่องปกติที่สุดที่เว็บแอปใด ๆ จะต้องใช้

อิเลคตรอนจะยอมให้เรา ห่อหุ้มเว็บแอปพลิเคชัน เพื่อการบริโภคเองด้วยวิธีง่ายๆ หลังจากทดสอบและตรวจสอบแล้วว่าทำงานได้อย่างถูกต้องฉันต้องยอมรับว่าหากไม่มีความชัดเจนเกี่ยวกับประโยชน์ที่แท้จริงของมันอย่างน้อยมันก็ค่อนข้างอยากรู้อยากเห็น ประสิทธิภาพที่แท้จริงนั้นไม่น่าทึ่งหากเราเปรียบเทียบกับการใช้ทรัพยากรที่ Chromium จะทำหากมีการขยายเมื่อเปิดเว็บไซต์เดียวกัน อิเล็กตรอนขึ้นอยู่กับ โครเมียม และในสภาพแวดล้อมรันไทม์ Node.js.

Electron มักจะตั้งคำถามเดิม ๆ ว่าต้องมีอะไรบ้างในการสร้างแอปพลิเคชันแบบสแตนด์อโลนเมื่อเปิดในแท็บจากเบราว์เซอร์ได้ สาเหตุอาจมาจากการผสานรวมกับเดสก์ท็อปได้ดีขึ้นไปจนถึงการประหยัดทรัพยากรบางส่วนไปจนถึงการจัดการบางไซต์แยก ที่นี่ทุกคนจะต้องค้นหาคำตอบของตัวเอง

ติดตั้ง Nativefier เพื่อสร้าง Electron WebApp บน Ubuntu

ในการทำงานนี้สิ่งแรกที่เราจะทำคือ ติดตั้ง Node.js และตัวจัดการแพ็คเกจ npm. สำหรับสิ่งนี้เราจะเปิดเทอร์มินัล (Ctrl + Alt + T) และเขียนสิ่งต่อไปนี้

sudo apt install nodejs npm

ณ จุดนี้เราจะติดตั้งยูทิลิตี้ที่จะทำการแปลงจากตัวจัดการแพ็คเกจ Node.js ในเทอร์มินัลเดียวกันเราเขียนคำสั่งต่อไปนี้

sudo npm install nativefier -g

ตอนนี้เราสามารถเริ่มสร้างเว็บแอปพลิเคชันของเราเองได้แล้ว เราจะต้องเปิดในเทอร์มินัลเท่านั้น (Ctrl + Alt + T) สิ่งต่อไปนี้:

nativefier ubunlog.com

Nativefier จะเริ่มห่อหุ้มเว็บไซต์ที่ระบุโดยอิสระ ในขณะเดียวกันก็จะยังคงลักษณะเฉพาะและจะได้รับการกำหนดไอคอนและชื่อ ตัวเรียกใช้แอปพลิเคชันของเราพร้อมกับไฟล์ที่จำเป็นอื่น ๆ เราสามารถค้นหาในโฟลเดอร์ที่มีชื่อเดียวกับเว็บในไดเร็กทอรีซึ่งเราได้ดำเนินการก่อนหน้านี้

ต้องมีการชี้แจงว่า Nativefier จะอนุญาตให้เรา ใช้ตัวเลือกต่างๆ ไปยังแอปพลิเคชันที่เราต้องการจัดแพคเกจ คุณสามารถตรวจสอบเอกสารในหน้าได้ GitHub. ตัวเลือกเหล่านี้มีตั้งแต่ความเป็นไปได้ในการปรับแต่งชื่อแอปพลิเคชันการเพิ่มไอคอนและลงท้ายด้วยการแก้ไขขนาดเริ่มต้นของหน้าต่างและอื่น ๆ ควรสังเกตด้วยว่าเราจะ อนุญาตให้ฝังโค้ด JavaScript หรือ CSS บน webapp ความเป็นไปได้ที่เปิดให้เราทวีคูณ

เพื่อให้เสร็จสิ้นเราสามารถถามตัวเองได้ว่าแอปพลิเคชันประเภทนี้สะดวกสบายกว่าหรือประหยัดทรัพยากรในอุปกรณ์ของเราได้สูงเพียงพอหรือไม่ เนื่องจากเราสามารถทำสิ่งเดียวกันได้โดยการเพิ่มลิงก์โดยตรงไปยังเดสก์ท็อปของเราทั้ง Chrome และ Chromium นี่ขึ้นอยู่กับรสนิยมของทุกคน