ลงคะแนนแอพ
ความท้าทายค่ายรหัสฟรี
แอพ Heroku - https://neckers-voteapp.herokuapp.com
แอพนี้สร้างขึ้นใน Mern Stack มันใช้: MongoDB, โหนด, Express, React, React Router, Redux, Socket.io, Material-UI และ Google Charts UI สามารถใช้บนมือถือแท็บเล็ตและเดสก์ท็อป
บันทึก :
- ส่วนประกอบเซิร์ฟเวอร์และไคลเอนต์เป็น isomorphic
- การรับรองความถูกต้องไม่ได้ใช้คุกกี้ แต่เป็นการผสมผสานในไคลเอนต์ (ในร้านค้า localStorage/Redux) และเซิร์ฟเวอร์โดย socket.io ตรวจสอบ
- การเลือกตั้งที่ได้รับการโหวตแล้วจะถูกบันทึกไว้ในพื้นที่ท้องถิ่น
เรื่องราวของผู้ใช้
- ในฐานะผู้ใช้ที่ได้รับการรับรองความถูกต้องฉันสามารถโพลของฉันและกลับมาในภายหลังเพื่อเข้าถึงพวกเขา
- ในฐานะผู้ใช้ที่ได้รับการรับรองความถูกต้องฉันสามารถแบ่งปันการสำรวจความคิดเห็นกับเพื่อนของฉัน
- ในฐานะผู้ใช้ที่ได้รับการรับรองความถูกต้องฉันสามารถเห็นผลลัพธ์รวมของการสำรวจความคิดเห็นของฉัน
- ในฐานะผู้ใช้ที่ได้รับการรับรองความถูกต้องฉันสามารถลบโพลที่ฉันตัดสินใจว่าฉันไม่ต้องการอีกต่อไป
- ในฐานะผู้ใช้ที่ได้รับการรับรองความถูกต้องฉันสามารถสร้างแบบสำรวจด้วยรายการที่เป็นไปได้
- ในฐานะผู้ใช้ที่ไม่ผ่านการตรวจสอบหรือรับรองความถูกต้องฉันสามารถเห็นและลงคะแนนในการเลือกตั้งของทุกคน
- ในฐานะผู้ใช้ที่ไม่ผ่านการตรวจสอบหรือรับรองความถูกต้องฉันสามารถเห็นผลลัพธ์ของการสำรวจความคิดเห็นในรูปแบบแผนภูมิ (สิ่งนี้สามารถนำไปใช้ได้โดยใช้ Chart.js หรือ Google Charts)
- ในฐานะผู้ใช้ที่ได้รับการรับรองความถูกต้องถ้าฉันไม่ชอบตัวเลือกในการสำรวจความคิดเห็นฉันสามารถสร้างตัวเลือกใหม่ได้
มันเป็นข้อผิดพลาด? ไม่มันเป็นคุณสมบัติ!
ตกลงพวกเขาไม่ใช่คุณสมบัติจริงๆ แต่มีการกระทำบางอย่าง ไม่ดีจริงๆ แต่สำหรับความท้าทายนี้ฉันไม่รังเกียจ
- ฉันสามารถลงคะแนนได้หลายครั้งถ้าฉันล้างพื้นที่เก็บข้อมูลในพื้นที่ของฉันหรือฉันเข้าถึงจากอุปกรณ์อื่น (หรือฉันไปในโหมดไม่ระบุตัวตน ฯลฯ )
- ใช่เพราะเพื่อติดตามคะแนนเสียงฉันต้องบันทึกข้อมูลบางอย่างในฝั่งเซิร์ฟเวอร์และด้วยผู้ใช้ที่ไม่มีการเข้าสู่ระบบฉันต้องทำงานหนักเพื่อตรวจสอบ ดังนั้น .. DB อยู่ใน Sandbox ที่ขับเคลื่อนโดย MLAB และฉันไม่ต้องการเครียดมากขึ้น
- ฉันไม่สามารถแก้ไขหรือลบตัวเลือกได้หลังจากการเผยแพร่โพล
- ไม่คุณทำไม่ได้ การกระทำเหล่านี้ไม่ได้อยู่ในเรื่องราวของผู้ใช้
- ฉันไม่สามารถเข้าสู่ระบบได้หลายครั้ง
- ใช่ทุกครั้งที่คุณเข้าสู่ระบบคุณจะได้รับ
session_id ที่แตกต่างกันทั้งสองด้าน: ไคลเอนต์และเซิร์ฟเวอร์
- ฉันไม่สามารถแก้ไขข้อมูลส่วนบุคคลของฉันได้เช่นอีเมลนิคหรือรหัสผ่าน
- ไม่คุณทำไม่ได้ การกระทำเหล่านี้ไม่ได้อยู่ในเรื่องราวของผู้ใช้
- ฉันไม่สามารถเปลี่ยนการตั้งค่าของฉันได้
- ใช่ฉันไม่ชอบ คุณลักษณะ นี้ในวิธีพิเศษ แต่ฉันตัดสินใจที่จะไม่ดำเนินการ เลิก ทำด้วยเหตุผลด้านความปลอดภัย
process.env
- Mongouri : คำถามของคุณในการตรวจสอบสิทธิ์ใน MongoDB Server
mongodb://<dbuser>:<dbpassword>@ds119508.mlab.com:19508/neckersbox - node_env : ตัวอย่างเช่น
production หมายเหตุ : สิ่งนี้จะต้องเหมือนกันระหว่างเซิร์ฟเวอร์และไคลเอนต์
สคริปต์
ในการรวบรวมหรือเรียกใช้แอพนี้ใช้ Gulp และ/หรือ NPM
- Build :
gulp build - Watch :
gulp watch หรือ npm run watch - ทำความสะอาด :
gulp clean - START SERVER :
gulp start หรือ npm run start-server หมายเหตุ : โดยปกติแล้ว start-server ต้นเพื่อแสดงว่าคุณควรทำงาน npm run start-server-debug
การกำหนดค่า MongoDB
ในการทำงานอย่างถูกต้องแอปพลิเคชันนี้จำเป็นต้องมีฐานข้อมูล MongoDB ที่มีสองคอลเลกชัน:
- bute_users เพื่อบันทึกผู้ใช้ที่ลงนาม
- bute_polls เพื่อบันทึกผู้ใช้โพล
