How Does the MEAN Stack Work?

-: เอาล่ะ มาดูภาพรวมกันดีกว่า MEAN stack ทั้งหมดมีลักษณะอย่างไรในหลักสูตรนี้หรือโดยทั่วไป ไม่ใช่แค่ในหลักสูตรนี้เท่านั้น เรามีฝั่งไคลเอ็นต์และฝั่งเซิร์ฟเวอร์ นั่นเป็นสิ่งสำคัญ ฝั่งไคลเอ็นต์คือสิ่งที่ผู้ใช้เห็น หน้าเว็บที่ทำงานในเบราว์เซอร์ ฝั่งเซิร์ฟเวอร์คือที่ใดที่หนึ่งบนเซิร์ฟเวอร์ที่เราปรับใช้โดยที่เราเรียกใช้ตรรกะทางธุรกิจของเรา และที่ผู้ใช้เข้าถึงโดยทางอ้อมเท่านั้น เราจะดูว่าการเข้าถึงนั้นทำงานอย่างไรในไม่กี่วินาที ดังนั้นในไคลเอนต์ เราใช้ Angular ซึ่งเป็นเฟรมเวิร์ก JavaScript ดังนั้นเราจึงใช้ JavaScript โดยปริยาย และเราใช้มันเพื่อสร้างส่วนต่อประสานกับผู้ใช้นั้น ทางฝั่งเซิร์ฟเวอร์ เราใช้ Node Express และ MongoDB Node Express สำหรับตรรกะและ MongoDB เป็นฐานข้อมูล อย่างที่ฉันพูดไป คุณไม่ต้องการเชื่อมต่อโดยตรงจาก Angular ตอนนี้ฝั่งไคลเอ็นต์ Angular รับผิดชอบส่วนต่อประสานกับผู้ใช้ ดังนั้นสำหรับการนำเสนอจึงเป็นแอปพลิเคชันหน้าเดียว ดังที่ฉันอธิบายในการบรรยายครั้งที่แล้วและแอปพลิเคชันหน้าเดียวนั้นสามารถแสดงผลโดย Node Backend ของเรา ดังนั้นเราจึงสามารถมีเส้นทางเดียว ซึ่งโดยพื้นฐานแล้วจะส่งคืนหน้า HTML เดียวนั้น แต่ก็สามารถแยกส่วนออกจากนั้นโดยสิ้นเชิงและให้บริการจากโฮสต์ที่แตกต่างกันโดยสิ้นเชิง เช่น โฮสต์คงที่บางตัวเช่น AWS Free ตอนนี้ในแอปพลิเคชันโหนด เรามีตรรกะทางธุรกิจหลักของเรา โดยเฉพาะอย่างยิ่งตรรกะที่ไม่ควรเปิดเผยต่อไคลเอ็นต์ เนื่องจากเหตุผลด้านความปลอดภัยหรือเหตุผลด้านประสิทธิภาพ เรามีการจัดเก็บข้อมูลแบบถาวร เพื่อให้ฐานข้อมูลนั้นและเราใส่ตรรกะการรับรองความถูกต้องของเราไว้ที่นั่นด้วย ตัวอย่างเช่น แน่นอนว่าเป็นส่วนหนึ่งของตรรกะทางธุรกิจของเรา ฉันแค่อยากจะเน้นว่าที่นี่ ตรรกะที่เราตัดสินใจว่าอีเมลและรหัสผ่านนั้นถูกต้องหรือไม่นั้นเกิดขึ้นบนเซิร์ฟเวอร์ เนื่องจากอีเมลและรหัสผ่านนั้นใช้งานบนไคลเอนต์ได้ง่าย ไม่มากบนเซิร์ฟเวอร์ เราจะเชื่อมต่อทั้งสองชิ้นได้อย่างไร? เราแลกเปลี่ยนคำขอและการตอบกลับ และคำขอและการตอบกลับเหล่านี้จะถูกส่งไปในเบื้องหลัง ซึ่งเรียกว่าคำขอ AJAX คุณอาจเคยได้ยินเรื่องนี้มาก่อน และเราใช้รูปแบบเดียวกันในเชิงมุม คำขอเหล่านี้เป็นคำขอที่สามารถส่งโดยที่เราไม่ต้องโหลดหน้าซ้ำ ซึ่งเป็นสิ่งที่เราต้องการอย่างแน่นอน พวกเขาจ่ายให้กับประเภทของข้อมูลที่เราแลกเปลี่ยนไม่ใช่ HTML เพราะเราไม่ต้องการโค้ด HTML เราทำการนำเสนอทั้งหมดและแสดงตรรกะใหม่ด้วย Angular แต่สิ่งที่เราได้รับคือสิ่งที่เรียกว่าข้อมูล JSON นั่นคือรูปแบบข้อมูลที่มีประสิทธิภาพจริงๆ สำหรับการเข้ารหัสข้อมูล เช่น รายการโพสต์ และคุณจะเห็นว่าหน้าตาเป็นอย่างไรในคอร์สนี้ นี่คือภาพรวม นี่คือวิธีการทำงานของรัฐ MEAN และนี่คือสิ่งที่เราจะนำไปใช้ในหลักสูตรนี้ เท่านี้ก็เพียงพอแล้ว มาเริ่มกันเลย และเริ่มตั้งค่าสภาพแวดล้อมการพัฒนาพื้นฐาน เราจะทำงานภายในหลักสูตรนี้ และเริ่มสร้างแอปพลิเคชัน MEAN stack ของเรา