portaldacalheta.pt
  • หลัก
  • กระบวนการและเครื่องมือ
  • การวางแผนและการพยากรณ์
  • การออกแบบ Ui
  • การจัดการโครงการ
ส่วนหน้าของเว็บ

พบกับโวลต์ซึ่งเป็นกรอบทับทิมที่มีแนวโน้มสำหรับการใช้งานแบบไดนามิก



โวลต์เป็นเฟรมเวิร์ก Ruby ที่ออกแบบมาสำหรับแอพพลิเคชั่นที่มีข้อมูลมากมาย ทั้งฝั่งเซิร์ฟเวอร์และไคลเอ็นต์เขียนด้วย Ruby (ซึ่งจะถูกคอมไพล์เป็น JS โดยใช้ OPAL) ดังนั้นสิ่งนี้จึงช่วยให้นักพัฒนาสามารถเขียนแอปพลิเคชันแบบไดนามิกได้โดยไม่ต้องเขียนโค้ด Javascript แม้แต่บรรทัดเดียว ถ้าคุณเป็น แฟนทับทิม เช่นฉันคุณจะรักกรอบนี้

ในความพยายามที่จะทำให้เว็บแอปพลิเคชันมีไดนามิกมากขึ้นเฟรมเวิร์ก Javascript ฟรอนต์เอนด์เช่น Angular.js, Backbone.js และ Ember.js ได้รับความนิยมอย่างมาก อย่างไรก็ตามเฟรมเวิร์กเหล่านี้มักต้องการแอปพลิเคชันแบ็คเอนด์จึงจะมีประโยชน์ดังนั้นจึงใช้ร่วมกับเว็บเฟรมเวิร์กเช่น Ruby on Rails และ Django



ในทางกลับกัน Ruby framework Volt สามารถจัดการส่วนหลังและส่วนหน้าแบบไดนามิกได้ เนื่องจากฟังก์ชันทั้งสองถูกรวมเข้ากับแกนหลักอย่างแน่นหนา (อันที่จริงโวลต์เป็นเหมือนสถาปัตยกรรม MVVM ซึ่งใช้ประโยชน์จากข้อได้เปรียบของการเชื่อมโยงข้อมูล) จึงทำให้นักพัฒนาสามารถสร้างแอปพลิเคชันเหล่านี้ได้อย่างรวดเร็ว



วิธีทำบอทที่ไม่ลงรอยกัน 2018

คุณลักษณะที่ยอดเยี่ยมมากที่มาจากกล่องคือคุณลักษณะแบบเรียลไทม์ของโวลต์ หากคุณเคยสร้างแอปพลิเคชันแบบเรียลไทม์คุณจะรู้ว่ากระบวนการนี้อาจเป็นเรื่องท้าทาย - คุณอาจติดตั้ง AJAX-polling, web sockets, Server-Sent Events (SSE) หรือแม้แต่ใช้บริการภายนอกเพิ่มความซับซ้อนให้กับแอปพลิเคชันและแม้กระทั่งมีค่าใช้จ่ายเพิ่มเติม . Volt ต่างจากเฟรมเวิร์กอื่น ๆ ตรงที่ทำให้การเชื่อมต่อกับเซิร์ฟเวอร์มีชีวิตอยู่ (ผ่านเว็บซ็อกเก็ต) ดังนั้นแทนที่จะส่งคำขอ Ajax สำหรับแต่ละการกระทำมันจะผลักการเปลี่ยนแปลงไปยังไคลเอนต์ทั้งหมดทันที ไม่จำเป็นต้องมีการกำหนดค่าเพื่อให้สามารถใช้งานได้



พบกับโวลต์ซึ่งเป็นกรอบทับทิมที่มีแนวโน้มสำหรับการใช้งานแบบไดนามิก

การใช้โวลต์เพื่อสร้างแอปพลิเคชันแชท

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



ก่อนอื่นมาติดตั้ง Volt และ MongoDB กัน กระบวนการหลังจะไม่กล่าวถึงในรายละเอียด:

gem install volt brew install mongodb mkdir -p /data/db

(สร้าง dbpath)



chown `id -u` /data/db (change the owner to have the proper dbpath permissions)

ตอนนี้เราพร้อมที่จะสร้างแอปแรกของเราเรียกว่า 'แชท' เราสามารถทำได้ง่ายๆในสองสามบรรทัด:

volt new chat cd chat

โครงสร้างเอกสารมีความคล้ายคลึงกับ Rails ความแตกต่างหลักที่ผู้ใช้ Rails จะสังเกตเห็นคือเรามีโฟลเดอร์พิเศษภายในแอพที่มีโฟลเดอร์ที่เหลือเช่นเนื้อหาตัวควบคุมโมเดลและมุมมองโฟลเดอร์พิเศษนี้คือ 'ส่วนประกอบ'



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

วิธีประมาณโครงการซอฟต์แวร์

เริ่มต้นเซิร์ฟเวอร์โดยเรียกใช้คำสั่ง 'volt server' ในคอนโซลและดูว่าหน้าตาเป็นอย่างไรในเบราว์เซอร์โดยไปที่ localhost: 3000:



volt server

อย่าลืมเริ่ม MongoDB ในคอนโซลด้วย:

mongod

เราสังเกตได้ว่า Volt มาพร้อมกับหน้าเริ่มต้นจำนวนมากรวมถึง 'Home' และ 'About' สิ่งเหล่านี้สามารถปรับแต่งได้ทันที



สิ่งที่ควรกล่าวถึงคือปุ่มเข้าสู่ระบบที่ด้านขวาบนของหน้า โวลต์มีฟังก์ชัน 'ผู้ใช้' ที่รวมเข้ากับเฟรมเวิร์กผ่านอัญมณี 'volt-user-template' ซึ่งเป็นวิธีการลงทะเบียนและรับรองความถูกต้องของผู้ใช้ทันที

เริ่มต้นใช้งาน

ตอนนี้มาเริ่มทำงานกับแอปของเรา ก่อนอื่นเราไม่จำเป็นต้องมีหน้า 'เกี่ยวกับ' เพื่อที่เราจะได้ลบสิ่งต่อไปนี้: app/main/views/main/about.html ไฟล์เกี่ยวกับการดำเนินการใน app/main/controllers/main_controller.rb ลบ /about เส้นทางใน app/main/config/routes.rb และลิงก์นำทางใน app/main/views/main/main.html

ตอนนี้เรามาเริ่มต้นด้วยการลงรายชื่อผู้ใช้ที่ลงทะเบียนทั้งหมด:

{{ if Volt.user }} { } {{ if user._id != Volt.user._id }} {{user._name}} {{ end }} {{ end }} {{ if params._user_id }} { current_conversation.each do }

{{ message._text }}

{{ end }} {{ if current_conversation.count == 0 }}

You have no messages yet. Start chatting!

{{ else }} {{ end }} Submit {{ end }} {{ else }}

This is a sample application built with Volt to demonstrate its real-time capabilities. Please log in to access it.

{{ end }}

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

โปรดสังเกตว่าค่าของอินพุตเป็นแอตทริบิวต์ที่เราสร้างขึ้นในโมเดลการรวบรวมเพจเนื่องจากเราไม่ต้องการให้เก็บไว้ในที่เก็บข้อมูล ตอนนี้เรามากำหนด current_conversation และ send_message วิธีการในคอนโทรลเลอร์:

def send_message unless page._new_message.strip.empty? _messages <[{ sender_id: Volt.user._id, receiver_id: params._user_id }, { sender_id: params._user_id, receiver_id: Volt.user._id }] }) end

ในเมธอด send_message เราจะเพิ่มข้อความใหม่ในคอลเล็กชันหากข้อความไม่ว่างเปล่า (เรากำลังตรวจสอบแบบอินไลน์เพื่อไม่ต้องยุ่งกับการตรวจสอบความถูกต้องในขณะนี้) จากนั้นตั้งค่าหน้า ._new_message to ‘’ ดังนั้นเราจึงว่างช่องป้อนข้อมูล

เราอาจต้องการเพิ่มบรรทัดนั้นต่อท้าย select_conversation วิธีการเช่นกัน วิธีการสนทนาปัจจุบันเพียงแค่ค้นหา _messages คอลเลกชันสำหรับข้อความระหว่างผู้ใช้ที่เลือกและผู้ใช้ปัจจุบัน

ปิดท้ายด้วยการแจ้งเตือนแบบเรียลไทม์

เพื่อให้เสร็จสิ้นฉันต้องการมีระบบแจ้งเตือนเพื่อให้ผู้ใช้สามารถเห็นเวลาที่ผู้ใช้รายอื่นส่งข้อความถึงพวกเขา

วิธีการเป็นโค้ชที่คล่องตัว

มาเพิ่มคอลเล็กชันใหม่ชื่อ _notifications และสร้างใหม่หลังจากส่งแต่ละข้อความ:

def send_message unless page._new_message.strip.empty? _messages << { sender_id: Volt.user._id, receiver_id: params._user_id, text: page._new_message } _notifications << { sender_id: Volt.user._id, receiver_id: params._user_id } page._new_message = '' end end def select_conversation(user) params._user_id = user._id unread_notifications_from(user).then do |results| results.each do |notification| _notifications.delete(notification) end end page._new_message = '' end def unread_notifications_from(user) _notifications.find({ sender_id: user._id, receiver_id: Volt.user._id }) end

นอกจากนี้เราจำเป็นต้องลบการแจ้งเตือนหลังจากที่ผู้ใช้เลือกการสนทนาและเห็นข้อความใหม่ดังนั้นฉันจึงเพิ่มส่วนนั้นไปที่ select_conversation วิธี.

มาเพิ่มตัวนับการแจ้งเตือนถัดจากชื่อผู้ใช้:

{{user._name}} {{ if unread_notifications_from(user).count > 0 }} {{ unread_notifications_from(user).count }} {{ end }}

ตอนนี้แอปพร้อมแล้วคุณสามารถเปิดเบราว์เซอร์สองสามตัวและเริ่มทดสอบความสามารถแบบเรียลไทม์ของ Volt

โวลต์คุ้มค่าที่จะลอง

แม้ว่าเฟรมเวิร์กโวลต์จะไม่สมบูรณ์และแข็งแกร่งเท่าเฟรมเวิร์ก Ruby ยอดนิยมส่วนใหญ่ที่มีมานานหลายปีแล้ว (ในขณะที่โวลต์ยังอยู่ในช่วงเบต้า) แต่ก็ควรพิจารณาและศึกษา

ในกรณีที่คุณสนใจให้ใช้บทช่วยสอน Ruby framework นี้เพื่อนำโวลต์ออกไปหมุน จับตาดูการพัฒนาต่อไปเนื่องจากโวลต์ดูเหมือนเฟรมเวิร์ก Ruby ที่มีแนวโน้มมากแม้ในช่วงแรกของการพัฒนานี้

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

การลงทุนใน Cryptocurrencies: The Ultimate Guide

กระบวนการทางการเงิน

การลงทุนใน Cryptocurrencies: The Ultimate Guide
WebVR ตอนที่ 2: Web Workers และ Browser Edge Computing

WebVR ตอนที่ 2: Web Workers และ Browser Edge Computing

ส่วนหน้าของเว็บ

โพสต์ยอดนิยม
Buggy CakePHP Code: 6 ข้อผิดพลาดที่พบบ่อยที่สุดนักพัฒนา CakePHP ทำ
Buggy CakePHP Code: 6 ข้อผิดพลาดที่พบบ่อยที่สุดนักพัฒนา CakePHP ทำ
รีวิว CakePHP 3 ของฉัน - ยังสดยังร้อน
รีวิว CakePHP 3 ของฉัน - ยังสดยังร้อน
ภาพรวมของตัวสร้างไซต์คงที่ยอดนิยม
ภาพรวมของตัวสร้างไซต์คงที่ยอดนิยม
นักพัฒนาชาวโบลิเวีย Yasett Acurana ได้รับทุนการศึกษา ApeeScape ครั้งที่หก
นักพัฒนาชาวโบลิเวีย Yasett Acurana ได้รับทุนการศึกษา ApeeScape ครั้งที่หก
การเขียนโปรแกรมจำนวนเต็มผสม: คู่มือสำหรับการตัดสินใจเชิงคำนวณ
การเขียนโปรแกรมจำนวนเต็มผสม: คู่มือสำหรับการตัดสินใจเชิงคำนวณ
 
แนวโน้มอีคอมเมิร์ซที่โดดเด่นและอิทธิพลต่อการออกแบบ (พร้อมอินโฟกราฟิก)
แนวโน้มอีคอมเมิร์ซที่โดดเด่นและอิทธิพลต่อการออกแบบ (พร้อมอินโฟกราฟิก)
การสำรวจเครื่องมือการทำแผนที่ออนไลน์ที่ดีที่สุดสำหรับนักพัฒนาเว็บ: Roadmap to Roadmaps
การสำรวจเครื่องมือการทำแผนที่ออนไลน์ที่ดีที่สุดสำหรับนักพัฒนาเว็บ: Roadmap to Roadmaps
GraphQL กับ REST - บทช่วยสอน GraphQL
GraphQL กับ REST - บทช่วยสอน GraphQL
ปรับปรุงการแปลงค่าเฉลี่ยเชิงปริมาณเฉลี่ยต่อเนื่อง
ปรับปรุงการแปลงค่าเฉลี่ยเชิงปริมาณเฉลี่ยต่อเนื่อง
ข้อมูลขนาดใหญ่: ใบสั่งยาสำหรับสภาพการวิจัยและพัฒนาเภสัชกรรม
ข้อมูลขนาดใหญ่: ใบสั่งยาสำหรับสภาพการวิจัยและพัฒนาเภสัชกรรม
โพสต์ยอดนิยม
  • วิธีการเรียกใช้การจำลองมอนติคาร์โล
  • วิธีการเรียนรู้ภาษาซี
  • ราคาอาหารทั้งหมดเทียบกับ Walmart
  • โหนด js ฝั่งเซิร์ฟเวอร์ javascript
  • อะไรคือหลักเกสตัลต์ของการรับรู้
  • โหนด js เว็บเซิร์ฟเวอร์เฟรมเวิร์ก
หมวดหมู่
  • กระบวนการและเครื่องมือ
  • การวางแผนและการพยากรณ์
  • การออกแบบ Ui
  • การจัดการโครงการ
  • © 2022 | สงวนลิขสิทธิ์

    portaldacalheta.pt