2017 3 - Siam University · ความสามารถของภาษา Angular JS...

3

บทท 2

แนวคด ทฤษฏและงานวจยทเกยวของ

2.1 แนวความคด

รปท 2.1 แนวคดการพฒนาระบบบนทกขอมลและออกรายงานเพอสนบสนนการใหบรการแอพพลเคชน Messenger Post

แนวคดการพฒนาระบบบนทกขอมลและออกรายงานเพอสนบสนนการใหบรการแอพพลเคชน Messenger Post คอเปนระบบทใชในการสนบสนนการใหบรการของแอพพลเคชน Messenger Post โดยผจดท าไดใชโปรแกรม Microsoft Visual Studio 2017 ในการพฒนาระบบและใช MongoDB ในการจดฐานขอมล ซงในการพฒนาระบบผจดท าไดใชรปแบบ MVC ในการพฒนาเพองายตอการทดสอบและแกไข ซงภาษาทใชในการพฒนาไดแก ภาษา C# ใชในการเขยนโคดค าสงเชอมตอกบฐานขอมล ภาษา JavaScript ใชในการเขยนค าสงควบคมการท างานของหนาจอ และภาษา Angular ใชในการออกแบบหนาจอแสดงผล

แอพพลเคชน Messenger Post

ระบบบนทกขอมลและออกรายงาน

2017 3.2

4

2.2 ทฤษฎทเกยวของ

1. Model-View-Controller (MVC) MVC คอ สถาปตยกรรมการพฒนาซอฟตแวรทมรปแบบทมการแยกสวนการพฒนาอยาง

ชดเจน ซงเปนรปแบบการพฒนาซอฟตแวร ทถอวาเปนแบบแผนสถาปตยกรรมทนยมใชในการพฒนาซอฟตแวร เพราะมการแยกสวนการพฒนา ท าใหงายตอการทดสอบหรอแกไขในบางสวนโดยจะไมไปกระทบกบสวนอนๆ ของระบบทก าลงพฒนา โดยสถาปตยกรรมแบบ Model-View-Controller (MVC) ไดแบงการพฒนาออกเปนสามสวนดงน

1.1 Model (M) คอสวนของ Business Logic และ สวนของ Entity ซงเปนสวนทท าหนาทตดตอกบฐานขอมล (Database)

1.2 View (V) คอสวนทใชแสดงผล ซงเปนสวนของ HTML, CSS และ JavaScript โดยท าเปน Web Application ทใชแสดงผล

1.3 Controller (C) คอสวนสมองทท าหนาทควบคมการท างานของหนาจอ และการดงขอมลจากสวนของ Model (M) มาแสดงผลในสวนของ View (V)

รปท 2.2 รปแบบการพฒนาซอฟตแวรแบบ MVC

Model

View Controller

5

2. ภาษา Angular ภาษา Angular คอ หนงใน Front-end framework ทก าลงไดรบความนยมในการพฒนา Web

Application โดยภาษา Angular สามารถตอบโจทยการใชงานในปจจบนทมการใชงานหนาเวบผานสมารทโฟน ภาษา Angular จะสามารถปรบรปแบบการแสดงผลใหเขากนอปกรณทใชงานเปดหนาเวบ ท าใหงายตอการใชงานหนาเวบนน

3. MongoDB MongoDB เปนฐานขอมลแบบ NoSQL ซงเปนฐานขอมลทไมมความสมพนธของตารางแบบ

เดยวกบ SQL ซงมการจดการเกบขอมลในรปแบบ JSON (JavaScript Object Notation) ในการบนทกขอมลทก Record ในฐานขอมล MongoDB จะเรยกวา Document ซงมการจดเกบคาเปน key และ Value หากเปรยบเทยบการจดเกบขอมลระหวาง MongoDB และ MySQL ดงตารางท 2.1 ตารางท 2.1 เปรยบเทยบระบบการจดเกบขอมลระหวาง MongoDB และ MySQL

MySQL MongoDB

Table Collection Row Document

Column Field Joins Embedded documents, linking

6

2.3 เวบไซตทเกยวของ

ในการพฒนาระบบผจดท าไดท าการคนหาและศกษาขอมลจากแหลงขอมลบนเวบไซต

ตางๆ ทเกยวของเพอเปนประโยชนในการพฒนาระบบ ดงน

รปท 2.3 https://devahoy.com/posts/getting-started-angular-js/

เวบไซตทชวยในการแกไขปญหาและใหขอมลความร เทคนค ประสบการณทเกยวกบการใชภาษาทใชพฒนาซอฟตแวร โดยไดน าความร และเทคนคมาใชภาษา Angular มาชวยในการพฒนาสวนของหนา Web Application

7

รปท 2.4 https://www.w3schools.com/

เปนเวบไซตทรวมภาษาเกยวกบการพฒนาโปรแกรม ซงรวบรวมขอมลรายละเอยดตางๆขนตอนการพฒนาโปรแกรมมากมาย ซงผจดท าไดน าโคดตวอยางมาใชในการพฒนาระบบในการเขยนค าสงการท างานของระบบบนทกขอมลและออกรายงานเพอสนบสนนการใหบรการแอพพลเคชน Messenger Post

8

รปท 2.5 http://wrapbootstrap.com/preview/WB0LX03F7

เปนเวบไซตทจ าหนายรปแบบตวอยางของหนาเวบเพอน าไปใชเปนตนแบบพฒนาเวบไซต ซงผจดท าไดน ารปแบบตวอยางเวบนมาใชในการพฒนาระบบเพอใหมความสวยงามและรวดเรวในการพฒนาระบบ

9

รปท 2.6 http://fontawesome.io

เปนเวบไซตทใหความรในการใชไอคอน ในการพฒนาเวบไซต โดยภายในเวบไซตประกอบไปดวยตวอยางไอคอนทใชในการพฒนาเวบไซต ซงสามารถน าไอคอนมาใชในการพฒนาเวบไซตได

10

รปท 2.7 https://golfapipol.github.io/angularjs-th

เปนเวบไซตใหความรทเกยวของกบภาษา Angular JS เปนภาษาทใชในการพฒนาหนาเวบไซต โดยภาษา Angular JS สามารถใชงานรวมกบภาษาอนไดหลากหลาย โดยผพฒนาไดน าความสามารถของภาษา Angular JS มาใชในการพฒนาระบบ

11

2.4 งานวจยทเกยวของ

โดยในการพฒนาระบบบนทกขอมลและออกรายงานเพอสนบสนนการใหบรการ

แอพพพลเคชน Messenger Post ไดมการศกษางานวจยทเกยวของเพอน าขอมลและแนวคดมาใช

ประโยชนในการพฒนาระบบ ซงมงานวจยทเกยวของดงน

รปท 2.8 หนาเวบระบบสารสนเทศต าบลสามบณฑต

รงรอง แรมสเยอ (2556) สาขาวชาเทคโนโลยสารสนเทศ คณะวทยาศาสตรและเทคโนโลย

มหาวทยาลยราชภฏพระนครศรอยธยา การพฒนาเวบไซตเพอใชในการบรหารจดการของฝายปกครอง ต าบลสามบณฑต เพอเปนระบบในการรวบรวมขอมลการใชงานสารสนเทศในต าบลสามบณฑตและเพอศกษาความพงพอใจในการเขาเยยมชมเวบไซต ซงในการพฒนาระบบสารสนเทศต าบลสามบณฑต ไดใชโปรแกรม Microsoft Visual Studio 2010 และฐานขอมล Microsoft SQL Server R2 ในการพฒนาและจดเกบขอมล

12

รปท 2.9 หนาจอระบบบรหารจดการอปกรณคอมพวเตอร

กลนภา สดสายญาต และ ส รรตน ชนพก (2559) สาขาวชาวศวกรรมศาสตรและอตสาหกรรมวจย ภาควชาวศวกรรมคอมพวเตอร คณะวศวกรรมศาสตร มหาวทยาลยสยาม เปนระบบทใชในการบรหารจดการอปกรณคอมพวเตอร โดยใชโปรแกรม Microsoft SQL Server และ Microsoft Visual Studio 2010 ในการพฒนาระบบ เพองายตอการคนหาประวตขอมลการยม-คน อปกรณคอมพวเตอรและปองกนการศนยหายของขอมล

13

รปท 2.10 เวบไซตอนทราเนตโรงพยาบาลธนบร 2

เอกพนธ อนด (2556) สาขาวชาวศวกรรมศาสตรและอตสาหกรรมวจย ภาควชาวศวกรรมคอมพวเตอร คณะวศวกรรมศาสตร มหาวทยาลยสยาม โดยไดใชโปรแกรม Microsoft Visual Studio 2010 และ Microsoft SQL Server ในการพฒนา ซงการจดท าเวบไซตจ าเปนตองรถงโครงสรางการออกแบบของเวบไซตใหมความสมดลและความสวยงามใหเหมาะสมกบองคกรในการน าไปใชงาน

14

รปท 2.11 โปรแกรมการจดการงานชาง

อาทตยา สอนแพง (2558) ภาควชาเทคโนโลยสารสนเทศ คณะเทคโนโลยสารสนเทศ มหาวทยาลยสยาม โครงงานสหกจศกษา เปนะบบทใชในการจดเกบขอมลการท างานของชางเพอใหงายตอการคนหาขอมล โดยในการพฒนาไดใชโปรแกรม Microsoft SQL Server 2014 ในการจดการฐานขอมล และพฒนาระบบโดยใชโปรแกรม Microsoft Visual Studio 2015

15

รปท 2.12 ระบบสารสนเทศงานทรพยากรมนษยบนเครอขายอนเตอรเนต

สรศกด จนทรสรสถาพร (2556) สาขาวชาเทคโนโลยสารสนเทศ คณะวทยาศาสตรมหาวทยาลยศรนครนทรวโรฒ เปนระบบเพอใชในงานดานประวตบคลากรและประวตการพฒนาบคลากรใหกบโรงเรยนอสสมชญ โดยใช ภาษา PHP ใชโปรแกรม Adobe Dreamweaver CS6 และ MySQL ในการจดการขอมล