beanui

โกรธถั่ว

กรอบสำหรับการพัฒนาเว็บ UI ผ่าน Javabean

ไม่ว่าสถานการณ์ต่อไปนี้จะปรากฏในงานของคุณ:

• ฉันเป็นนักพัฒนา Java และไม่เชี่ยวชาญด้านเทคโนโลยีเว็บ แต่วันนี้ฉันถูกจัดให้พัฒนาหน้าง่าย ๆ
• โครงการ Backend Java สองเดือน (ส่วนใหญ่เป็นแบ็กเอนด์) เนื่องจากไม่มีใครในทีมที่มีความเชี่ยวชาญในส่วนหน้าใช้เวลาหนึ่งเดือนในการสร้างหน้า
• ฉันสร้างระบบการจัดการห้องสมุดเมื่อสองปีก่อนเมื่อปีที่แล้วฉันได้สร้างระบบการจัดการการจัดซื้อและปีนี้ฉันสร้างระบบการจัดการผู้ใช้
• ฉันเป็นนักพัฒนา Java และฉันไม่สนใจที่จะเข้าร่วมในการพัฒนาเว็บ

เฟรมเวิร์กเว็บ UI ใดที่ได้รับความนิยมในปัจจุบัน?

สิ่งที่ฉันกล่าวถึงข้างต้นคือความสับสนที่ฉันพบบ่อย ในแนวโน้มปัจจุบันของการแยกด้านหน้าและด้านหลัง Java เกือบจะหมดอายุการลงทุนในเฟรมเวิร์กเว็บ UI แม้ในฐานะนักพัฒนา Java เราไม่ค่อยใช้กรอบ Java UI เช่น Struts และ JSF เพื่อพัฒนาและ JSP ก็ไม่ค่อยเขียน แต่ในชีวิตประจำวัน Javaer แม้ว่าคนหนึ่งร้อยคนไม่เต็มใจที่จะทำเช่นนั้นพวกเขาจะยังคงเผชิญกับความต้องการ UI แต่เมื่อเปิดเครื่องมือค้นหาพวกเขาเต็มไปด้วยเทคโนโลยีใหม่ที่เกิดขึ้นหลังจากนั้นอีก บางทีมันอาจเป็นเรื่องยากสำหรับผู้ที่อยู่ในนั้นเพื่ออธิบายว่ากรอบเว็บยอดนิยมในปัจจุบันคืออะไร

การแยกด้านหน้าและด้านหลัง

เมื่อพูดถึงการแยกส่วนหน้านี่เป็นสถานการณ์ที่ฉันมักจะคิดถึง หากเราเพียงแค่แบ่งระบบ UI ที่ติดตั้งไว้เราจะพัฒนาเป็นสองประเภท:

• ระบบภายนอก (เช่นพอร์ทัลบล็อก ฯลฯ )
• ระบบภายใน (เช่นระบบการจัดการ ฯลฯ )

จากนั้นระบบภายนอกมักจะรับผิดชอบเจ้าหน้าที่ UI มืออาชีพหรือแม้แต่ทีม UI ในขณะที่ระบบภายในไม่จำเป็นต้องเป็นกรณี ในเวลานี้งานของการพัฒนาส่วนหน้าตกอยู่กับวิศวกรด้านหลัง

ในกรณีนี้การแยกด้านหน้าและด้านหลังจะมีความสวยงามน้อยลงซึ่งหมายความว่า:

• เรียนรู้เฟรมเวิร์กส่วนหน้า (jQuery, ReactJs, Vue, Angular)
• เรียนรู้วิธีการทดสอบส่วนหน้า (หน่วย, เยาะเย้ย)
• เรียนรู้การรวบรวมและบรรจุภัณฑ์ส่วนหน้า
• ในความเป็นจริงยังมีทฤษฎีและแนวคิดมากมายที่ต้องเข้าใจ
• จำนวนความรู้ทั้งหมดในส่วนหน้านั้นไม่น้อยไปกว่าแบ็กเอนด์และเกินกว่าความยากลำบากในการเรียนรู้เกี่ยวกับแบ็กเอนด์

ในที่สุดหลังจากที่คุณสร้างความรู้คุณใช้ความพยายามอย่างมากในการสร้างหน้าส่วนหน้าและคุณอาจยังถูกวิพากษ์วิจารณ์

กระบวนการพัฒนา UI ภายในอุดมคติของ Javaer

• ไม่จำเป็นต้องรู้ความรู้ทุกประเภทเกี่ยวกับส่วนหน้า
• หลังจากพัฒนารหัสแบ็กเอนด์ (เช่นบริการ RESTFUL) คุณจะต้องมีการกำหนดค่าอย่างง่ายเพื่อแสดงผลหน้าเว็บ

ระบบภายในของเรามักจะไม่ต้องการเอฟเฟกต์ที่ยอดเยี่ยมภาพเคลื่อนไหวที่ซับซ้อนหรือโครงสร้างที่ปรับแต่งสูง อาจเป็นเพียงทางเข้าบริการแบ็คเอนด์หรือจัดการการกำหนดค่าบางอย่างหรือจัดการวัตถุข้อมูลง่าย ๆ (เช่นผู้ใช้คำสั่งซื้อผลิตภัณฑ์ ฯลฯ ) หรือนำเสนอรายงานสองมิติทั่วไป การดำเนินการมากที่สุดของพวกเขาคือเพียงแค่ cruds บนวัตถุข้อมูล ดังนั้นฉันจึงคิดว่าฉันสามารถสร้างรหัสส่วนหน้าย้อนกลับผ่าน Java ได้หรือไม่ ก่อนหน้านั้นเฟรมเวิร์กเช่น GWT ได้ทำสิ่งนี้ แต่รหัสนั้นมีการรุกรานเกินไป

เกี่ยวกับคุณสมบัติของ beanui

• การกำหนดค่าที่บริสุทธิ์ ใช้คำอธิบายประกอบ Java อย่างเต็มที่สำหรับคำอธิบาย UI
• คำอธิบาย UI รหัสที่ไม่รุกราน จะไม่ส่งผลกระทบต่อโครงการบริการแบ็กเอนด์ restful
• การพัฒนาอย่างรวดเร็ว
• มีความสามารถในการปรับแต่ง UI ในระดับหนึ่ง

การพึ่งพาอาศัยกัน

1. จำเป็นต้องติดตั้ง NPM: ติดตั้ง NodeJS 10.0.0 หรือ NPM 6.2.0;
2. จำเป็นต้องติดตั้ง Apache Maven;

ติดตั้ง beanui

1. git clone https://github.com/magic-bunny/beanui
2. cd beanui
3. mvn install

ติดตั้งและเรียกใช้ตัวอย่าง beanui

1. คัดลอกไดเรกทอรี beanui/vue ไปยังไดเรกทอรีใด ๆ %your_vue_path%
2. cd %your_vue_path% และ npm install
3. เพิ่มโหนดการกำหนดค่า <workPath>%your_vue_path%</workPath> ในปลั๊กอิน beanui-maven-plugin ใน pom.xml
4. cd beanui/demo และ mvn install
5. java -jar demo-1.0.jar
6. เปิดเบราว์เซอร์และป้อน http://localhost:8080

รันการสอบ beanui ในโหมด dev

1. แก้ไขโหมดการทำงานของไฟล์ pom.xml เป็น dev <mode>dev</mode>
2. cd beanui/demo
3. mvn install

รายการโปรแกรม

เริ่มสร้างโครงการ Beanui และจำเป็นต้องสร้าง Router.yml

หมายเหตุ: ไม่จำเป็นต้องใช้ Router.YML หากไม่ได้กำหนดค่าเฟรมเวิร์กจะสแกนคลาสที่มีคำอธิบายประกอบทั้งหมดที่มี @Component และแปลง ในเวลานี้แอตทริบิวต์ path จะต้องมีการกำหนดค่า หากไม่ได้กำหนดค่าจะเป็น /

หากคุณต้องการโครงการ Beanui ที่ง่ายที่สุดให้ดูเดี่ยวเดี่ยว

อินสแตนซ์เราเตอร์หน้าเดียว

 path : /test
component : demo.view.layout.card.CardComponent

พร้อมเราเตอร์เมนูด้านซ้ายมือ

 name : root
children :
  - title : home
    icon : star
    component : demo.view.layout.card.CardComponent

พร้อมหน้าเข้าสู่ระบบและเราเตอร์เมนู

 path : /login
component : demo.view.LoginComponent
children :
  - title : home
    icon : star
    component : demo.view.layout.card.CardComponent 

คำแนะนำคำอธิบายประกอบ Javabean

หากคุณต้องการเข้าใจว่าการควบคุมแต่ละครั้งเขียนใน Javabean ได้อย่างไรโปรดคลิก

หมายเหตุ: เนื่องจากมีการใช้องค์ประกอบ UI (ele.me) คุณสามารถอ้างถึงคำอธิบายองค์ประกอบขององค์ประกอบ UI ได้อย่างสมบูรณ์

คำอธิบายปลั๊กอิน beanui maven

เพื่อทำความเข้าใจการใช้ปลั๊กอิน Maven โปรดคลิก

หากคุณต้องการทราบวิธีการใช้ไลบรารีการปรับปรุงโปรดคลิก

ใบอนุญาต

Beanui ได้รับใบอนุญาตภายใต้ใบอนุญาต MIT ดูใบอนุญาตสำหรับรายละเอียดเพิ่มเติม