PaintApp

แอพ Python Paint

แอพสีพื้นฐานที่สร้างขึ้นสำหรับ JR Dev Hackathon Challenge

• คำแนะนำ Hackathon
• เกี่ยวกับแอพ Python Paint
• คุณสมบัติ
• ปัญหาที่รู้จัก
• ซ้อนเทค
• การปรับใช้
  • การปรับใช้บนเซิร์ฟเวอร์ท้องถิ่น
  • การปรับใช้กับ Python ทุกที่
• เกี่ยวกับนักพัฒนา
• การสาธิตการจับภาพหน้าจอ
  • การควบคุมพื้นฐาน
  • บันทึกแก้ไขและลบ
  • มุมมองและโปรไฟล์แกลเลอรี่

การสาธิต:

การสาธิตสด

คำแนะนำ Hackathon

Paint App - กลายเป็น Bob Ross

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

วันนี้ความท้าทายของคุณคือการสร้างหนึ่งในด้านล่าง:

อย่างเดียว

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

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

เต็มสแต็ค (ไม่บังคับ)

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

• ศิลปะที่แชร์ได้
• ไฟล์ที่ประหยัดได้
• โปรไฟล์ผู้ใช้ที่มีแกลเลอรี่ของงาน

สำหรับทีมที่มีนักออกแบบ UX/UI

การต้อนรับครั้งใหญ่สู่นักออกแบบ UX/UI คนแรกของเรา! ทีมของคุณโชคดีสุด ๆ ที่มีวิสัยทัศน์และกลเม็ดเด็ดพรายที่นักออกแบบสามารถนำมาได้! เพื่อให้แน่ใจว่าคุณได้รับเครดิตสำหรับการทำงานของคุณโปรดรวมการออกแบบของคุณในรูปแบบที่แบ่งปันได้ (แนะนำให้ใช้ PDF, Adobe XD หรือ FIGMA สาธารณะ) สถานที่ที่ดีที่สุดในการรวมสิ่งนี้อยู่ในหน้า Landing Page ของแอปพลิเคชันและในไฟล์ readme ของ GitHub Repo ขอแนะนำให้คุณแบ่งปันผลงานของคุณใน LinkedIn และ Twitter เนื่องจากสิ่งนี้นับต่อการเล่าเรื่องสำหรับคุณเป็นการส่วนตัว

เกี่ยวกับ

นี่คือแอปพลิเคชั่นการวาดภาพเว็บที่เรียบง่ายที่สร้างขึ้นโดยใช้ Django Framework และ JavaScript เพื่ออนุญาตให้มีปฏิสัมพันธ์กับผืนผ้าใบ JavaScript เป้าหมายของโครงการนี้คือการดำเนินการ JR Dev Hackathon Challenge ที่โฮสต์โดย Mintbean

คุณสมบัติ

การควบคุม

• แปรงง่ายๆ
• ยางลบ
• เครื่องมือแสตมป์ลวดลาย
• ตัวเลือกสี
• ตัวเลื่อนขนาดแปรง
• ปุ่ม Clear Canvas

ฟังก์ชั่น

• ปรับขนาดแปรง/ยางลบ/แสตมป์
• จัดเก็บขนาดสำหรับแต่ละเครื่องมือ
• เก็บสีสำหรับแต่ละเครื่องมือ
• การสร้างบัญชีผู้ใช้
• บันทึกผ้าใบลงในบัญชี
• มุมมองบัญชี
• ดูงานศิลปะที่ผู้ใช้บันทึก
• ดูกิจกรรมล่าสุด
• ลบศิลปะที่บันทึกไว้
• แก้ไขศิลปะที่บันทึกไว้ก่อนหน้านี้

ฟังก์ชั่นที่จะเพิ่ม

• รูปร่างแปรงเพิ่มเติม
• รูปร่างแสตมป์เพิ่มเติม
• เครื่องมือเส้น/รูปร่าง
• เติมเครื่องมือ
• เลิกทำ/ทำซ้ำ
• โหลด/วางภาพ
• บันทึกเป็นสำเนา

ปัญหาที่รู้จัก

• ดูปัญหาสำหรับรายการข้อบกพร่องที่รู้จัก

 NOT compatable with Internet Explorer

ซ้อนเทค

• Python 3.9
• Django 3.2.8
• Bootstrap CSS 5.0.2
• Bootstrap JS 5.0.2
• jQuery 3.5.1
• Fontawesome 5.15.1
• Google Webfonts
• Canvas API

การปรับใช้

มีทรัพยากรหลายอย่างสำหรับการปรับใช้แอพ Django หนึ่งในแพลตฟอร์มที่ง่ายที่สุดคือ Python ทุกที่ซึ่งมีระดับฟรี ฉันขอแนะนำอันนี้เพราะมันตรงไปตรงมา

การปรับใช้บนเซิร์ฟเวอร์ท้องถิ่น:

• โคลนสำเนาของโครงการ
• การใช้ VENV สร้างสภาพแวดล้อมเสมือนจริงสำหรับโครงการ
• เปิดตัวสภาพแวดล้อมเสมือนจริงและใช้ "ข้อกำหนด. txt" เพื่อติดตั้งการพึ่งพาที่จำเป็นทั้งหมดรวมถึงเวอร์ชันของ Django โครงการนี้ถูกสร้างขึ้น

 NOTE: From this point, all commands should be run while working in the virtual environment you created

• จากพรอมต์คำสั่ง/เทอร์มินัลตรวจสอบให้แน่ใจว่าคุณกำลังทำงานในสภาพแวดล้อมเสมือนจริงนำทางไปยังโฟลเดอร์ที่มีโครงการ
• สร้างไฟล์ในโฟลเดอร์โปรแกรม "PaintApp" เรียกว่า ".env"

 NOTE: This next step only works on Python 3.6 or higher:

• จากคำสั่งพรอมต์/เทอร์มินัลรัน:
  • python -c "import secrets; print(secrets.token_urlsafe())"
• สิ่งนี้จะสร้างคีย์ลับสำหรับโครงการ
• คัดลอกคีย์ลับที่สร้างขึ้นใหม่เปิด. ENV ในโปรแกรมแก้ไขรหัส/ข้อความและเพิ่มบรรทัดต่อไปนี้ (คำพูดดูเหมือนจะเป็นทางเลือก):
  • SECRET_KEY='*your_secret_key_here*'
• บันทึกและปิดไฟล์. ENV
• เรียกใช้คำสั่งต่อไปนี้เพื่อสร้างและตั้งค่าฐานข้อมูล:
  • python manage.py makemigrations
  • python manage.py migrate
• การตั้งค่าบัญชีผู้ดูแลระบบหรือซูเปอร์ดูเซอร์นั้นค่อนข้างตรงไปตรงมาในเอกสาร อ้างอิงถึงลิงค์ต่อไปนี้สำหรับขั้นตอนทีละขั้นตอน
  • https://docs.djangoproject.com/en/3.2/intro/tutorial02/#creating-an-admin-user
• ตอนนี้คุณควรพร้อมที่จะเปิดตัวสำเนาในพื้นที่ของคุณ!
• เรียกใช้คำสั่งต่อไปนี้
  • python manage.py runserver

การปรับใช้กับ Python ทุกที่:

คำแนะนำของ Python Anywhere มีรายละเอียดมากและควรเพียงพอที่จะช่วยให้คุณได้รับสำเนาและทำงาน

• https://help.pythonanywhere.com/pages/deployexistingdjangoCject/

เกี่ยวกับนักพัฒนา

โปรไฟล์ LinkedIn

ฉันเล่นน้ำในการเข้ารหัสมาตั้งแต่โรงเรียนมัธยมย้อนกลับไปในสมัยของ AOL, Geocities และ Angelfire ฉันใช้เวลาสองสามปีในฐานะนักออกแบบกราฟิกและนักพัฒนาเว็บส่วนใหญ่ทำงานใน WordPress สำหรับการพัฒนาเว็บของฉัน เมื่อเร็ว ๆ นี้ฉันตัดสินใจที่จะเปลี่ยนไปใช้การพัฒนาซอฟต์แวร์และเปลี่ยนอาชีพ ฉันจบหลักสูตร Python Full Stack ที่ Coding Dojo รับเข็มขัดหนังสีดำจากโครงการสุดท้ายของฉันซึ่งสามารถดูได้ที่นี่:

• ผู้กำหนดตารางเวลาการกะโรงพยาบาลสัตวแพทย์

ฉันสร้างแอพสีนี้สำหรับงาน Jr Dev Hackathon จ้างงานผ่าน Mintbean สำหรับข้อมูลเพิ่มเติมเกี่ยวกับวิธีที่ฉันสร้างแอพนี้กระบวนการที่ฉันต้องผ่านและความท้าทายที่ฉันต้องแก้ไขโปรดไปที่หน้า Landing Page ของการสาธิต

อัปเดต

ผลลัพธ์ได้รับการโพสต์และโครงการได้รับรางวัล Mintbean Star Award หากต้องการดูสิ่งนี้ไปที่ https://hire.mintbean.io ค้นหาชื่อของฉันและดูรายละเอียดภายใต้โครงการ 1

ไชโย

การจับภาพหน้าจอสาธิต

การควบคุมพื้นฐาน

บันทึกแก้ไขและลบ

มุมมองและโปรไฟล์แกลเลอรี่