วิธีการพัฒนาส่วนหน้า (UI) สำหรับเว็บไซต์ Django ของฉัน


26

ฉันกำลังเรียนรู้ Django และใหม่ต่อการพัฒนาเว็บ โปรดขอโทษด้วยถ้าคุณพบว่าคำถามนี้โง่เกินไป

ดังนั้นฉันกำลังสร้างแอปพลิเคชัน Facebook โดยใช้ Django ซึ่งฉันต้องการโฮสต์ใน Google App Engine โครงการจะเน้นที่การอ่านฟีด RSS / Atom ของเว็บไซต์ใด ๆ (นั่นคือทั้งหมดที่ฉันสามารถพูดได้ตอนนี้)

ฉันมั่นใจในการประมวลผลไฟล์ RSS / Atom แต่ฉันกังวลเกี่ยวกับส่วนหน้า (ส่วนต่อประสานผู้ใช้) - "ส่วนการออกแบบ" ฉันไม่ทราบว่า HTML / CSS / JavaScript (ฉันสามารถจัดการกับสิ่ง HTML ง่ายๆ แต่ไม่นำไปสู่สิ่งที่ออกแบบ)

ก่อนอื่นฉันคิดว่าการใช้เครื่องมืออย่าง Dreamweaver หรือซอฟต์แวร์ที่เทียบเท่ากันสำหรับการออกแบบ UI แต่เมื่อฉันเริ่มเรียนรู้ django และเริ่มเข้าสู่มันดูเหมือนว่าจะเป็นสิ่งที่ "เป็นไปไม่ได้"

ดังนั้น,

  • ฉันจะออกแบบส่วน UI ของเว็บไซต์ได้อย่างไร ฉันไม่สามารถใช้เครื่องมืออย่าง Dreamweaver ได้หรือไม่?

    • ถ้าไม่ใช่เป็นวิธีที่ดีที่สุดสำหรับคนอย่างฉันที่ไม่รู้จัก JavaScript / CSS
    • ถ้าใช่อะไรคือทางเลือกโอเพนซอร์ซที่ดีที่สุดสำหรับ Dreamweaver?
    • Google App Engine สามารถจัดการกับสิ่งเหล่านี้ได้หรือไม่?
  • คนที่จัดการกับ Django แก้ไขหน้าเทมเพลตเหล่านั้นอย่างไร Django กล่าวถึงมันจะแยกส่วนตรรกะ (มุมมอง) และการออกแบบ (แม่แบบ) เพื่อให้แผนกต่างๆใน บริษัท สามารถจัดการแยกต่างหาก แต่เมื่อพิจารณาถึงความจริงที่ว่าหน้า HTML ของ Django เต็มไปด้วย "แท็ก" ซึ่งไม่มีทางเกี่ยวข้องกับ HTML (การออกแบบ) คน UI จัดการอย่างไร


1
ก่อนอื่นทำให้มันทำงานแล้วทำให้มันสวย
msw

คำตอบ:


18

เอกสาร Django ไม่เคยพูดถึงว่าคนที่ไม่รู้ว่า HTML / JS / CSS นั้นเกี่ยวกับอะไรสามารถใช้งานได้ การแยกข้อกังวลนั้นกระทำในแบ็กเอนด์ซึ่งการกระทำที่เกิดขึ้นจริง (มุมมอง) จะถูกแยกออกจากเลเยอร์ฐานข้อมูลหรือตรรกะการกำหนดเส้นทาง URL - ที่ช่วยให้การเชื่อมต่อหลวม ไม่ได้หมายความว่าคุณสามารถเขียนมุมมองโดยไม่ต้องเข้าใจแบบจำลองของคุณ ในทำนองเดียวกัน (ก็ไม่ใช่แบบเดียวกัน) คุณจำเป็นต้องมีความเข้าใจใน HTML / CSS เพื่อให้ได้หน้าเว็บพื้นฐาน คุณอาจจะหรืออาจไม่ต้องการที่จะเรียนรู้บาง JS แต่ฉันคิดว่ากับ HTML5 มันเป็นสิ่งสำคัญมากที่จะรู้จาวาสคริปต์บางอย่าง

ไม่มีนักพัฒนาเว็บไซต์ที่มีสติจะแนะนำให้ใช้โปรแกรมแก้ไขแบบ WYSIWYG เช่น DreamWeaver เขียน HTML ด้วยมือ อย่างไรก็ตามคุณอาจใช้สิ่งต่าง ๆ เช่นHTML5 Bolierplateเพื่อให้โครงการของคุณเริ่มต้นอย่างรวดเร็ว

Google AppEngine เป็น PaaS ที่คุณสามารถใช้เพื่อปรับใช้แอปพลิเคชันของคุณ มันจะให้สิ่งอื่น ๆ , Python runtime, ที่เก็บข้อมูลการจำลองแบบสูงเป็นต้น - แต่มันจะไม่ดูแลการสร้างส่วนหน้าของคุณ

หากคุณกำลังจะจ้างคนดูแล front-end บุคคลนั้นจะต้องรู้วิธีใช้แท็ก Django เช่นกัน (ถ้าคุณทำตามรูปแบบ MVC - หรือ MTV อย่างใกล้ชิด) พวกเขาจะกำหนดเส้นเบลอ ระหว่างหน้าเว็บ "คงที่" และ "ไดนามิก" แม้ว่าคุณเลือกที่จะจ้างผู้พัฒนาส่วนหน้าฉันขอแนะนำให้คุณเข้าใจพื้นฐานของ HTML และ CSS (อย่างน้อยก็มากจนคุณรู้ว่ามันทำงานอย่างไรและคุณจะให้บริการไฟล์ CSS คงที่ได้อย่างไร) มันจะช่วยคุณในระยะยาวเท่านั้น

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


2
+1 "ผู้พัฒนาเว็บที่ไม่มีเหตุผล"
msw

อาจเป็นเรื่องจริงที่ไม่มีนักพัฒนาเว็บที่มีสติจะต้องการเขียนเทมเพลท HTML ในสิ่งที่คล้ายกับ Dreamweaver แต่นักออกแบบเว็บไซต์ส่วนใหญ่ดูเหมือนจะต้องการใช้ Dreamweaver หรือคล้ายกับ CSS และคำถามนี้พูดถึง CSS ดังนั้นจึงเป็นการดีที่ได้มีทิศทางในการทำงานกับ Dreamweaver และ Django
Westcroft_to_Apse

4

สิ่งที่ฉันทำคือฉันออกแบบเลย์เอาต์ใน Dreamweaver หรือจ้างนักออกแบบเพื่อสร้าง HTML "wireframes" ด้วยข้อมูลปลอมจากนั้นฉันไปที่มันและใช้เทมเพลตของ Django (หรือของ Jinja) เพื่อทำให้มันเป็นเทมเพลตที่ใช้งานได้ ฉันรู้ HTML บางตัว แต่ฉันจะไม่สามารถทำสิ่งที่น่าสนใจได้ การทำงาน? ใช่ ก็ดีที่จะดู Glob No!

ดังนั้นโดยสรุป ด้วยความรู้พื้นฐานเกี่ยวกับ HTML คุณสามารถแก้ไขเอกสาร HTML ที่สร้างไว้ล่วงหน้าเพื่อใช้เป็นเทมเพลต


1

อย่างไรก็ตามคุณจะต้องเข้าใจว่า HTML นั้นทำงานอย่างไร คุณสามารถเริ่มต้นด้วยเค้าโครงที่เรียบง่ายโดยไม่ต้องมีกราฟิคสวยงาม

คุณสามารถใช้โปรแกรมแก้ไขใด ๆ ที่คุณชอบ (Dreamweaver หรืออะไรก็ตาม) แต่แท็กของ django กำลังเชื่อมโยงแม่แบบกับรหัสโปรแกรมดังนั้นไม่มีโปรแกรมแก้ไขใดที่สามารถทำกับ WYSIWYG (สิ่งที่คุณเห็นคือสิ่งที่คุณได้รับ) IDE บางตัวมีผู้ช่วยเพียงไม่กี่คนสำหรับแท็กนั้น แต่ไม่มากพวกเขาเพียงทำสิ่งต่างๆโดยอัตโนมัติเช่นการปิดแท็กและอื่น ๆ

หรือคุณสามารถจ้าง freelancer เพื่อสร้างและรวมแม่แบบในแอปพลิเคชันของคุณ แต่ไม่ใช่วิธีที่ดีที่สุดในการเรียนรู้บางสิ่งบางอย่าง :)


0

บางทีเรียนรู้วิธีใช้ html + bootstrap Bootstrap เป็นแพ็คเกจที่ทันสมัยในการสร้างเว็บไซต์ที่ตอบสนองได้ซึ่ง CSS และ JavaScript เกือบทั้งหมดจะถูกดูแลให้คุณ ดังนั้นไม่จำเป็นต้องเจาะลึกลงไปใน html + css + js

สิ่งที่คุณจะทำหลังจากที่คุณรู้ว่ามี bootstrap เพียงพอที่จะไปที่ตัวอย่าง bootstrapเหล่านี้จากนั้นเริ่มออกแบบเว็บของคุณจากที่นั่น จากนั้นเมื่อคุณต้องการองค์ประกอบเฉพาะองค์ประกอบให้ไปที่ลิงค์นี้แล้ว

ฉันรู้น้อยมากเกี่ยวกับ HTML, CSS และ JS และ Bootstrap ช่วยชีวิตฉันไว้ คุณจะต้องรู้พื้นฐานเบื้องต้นของสิ่งเหล่านั้น แต่ถ้าคุณเข้าสู่การพัฒนาเว็บ

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.