Machine Translated by Google

Ứng dụng Web

Phát triển
(Công cụ và Môi trường phát triển)

Phòng thí nghiệm S3. Giảng viên: Thanh Bình Nguyễn

Ngày 1 tháng 2 năm 2020

S3 Phòng thí nghiệm

Phòng thí nghiệm hệ thống phần mềm thông minh

1
Machine Translated by Google

“Một trang web thành công phải đạt được ba điều: Thu

hút đúng đối tượng khách truy cập.

Hướng dẫn họ đến các dịch vụ hoặc sản phẩm chính mà bạn cung cấp.

Phòng thí nghiệm S3.

Thu thập thông tin liên lạc cho mối quan hệ hiện tại và tương lai.”

– Mohamed Saad

2
Phát triển ứng dụng web
Machine Translated by Google

Ngôn ngữ, Khung

• Phía khách hàng:

• HTML5, CSS3 và Javascript

• Khởi động 4, JQuery

Phòng thí nghiệm S3.

• ReactJS, VueJS

• Phía máy chủ:

• NodeJS với Express

• PHP (5+) với CodeIgniter

3
Phát triển ứng dụng web
Machine Translated by Google

Biên tập viên - IDE

• Mọi trình soạn thảo đều có thể được sử dụng để phát triển ứng dụng web

• Những cái bản

• Văn đơn tuyệt
giản: vời: https://www.sublimetext.com/

• Notepad (Có sẵn trong Windows)

• NodePad++: https://notepad-plus-plus.org/downloads/

• Đã hoàn thành: Ellipse (Mã nguồn mở), Netbean (Oracle),

• Webstorm (JetBrains - Giáo dục miễn phí), Phpstorm (JetBrains),

Phòng thí nghiệm S3.

https://www.jetbrains.com/community/education/#students

• Visual Studio Code (Microsoft - Miễn phí) - https://code.visualstudio.com/

4
Phát triển ứng dụng web
Machine Translated by Google

Quản lý mã
• Thích sử dụng dịch vụ SaaS:

• GITHUB: https://github.com/

• Khách hàng:

Phòng thí nghiệm S3.

• Giao diện người dùng:

■ Cây nguồn: https://www.sourcetreeapp.com/

■ GitKraken: https://www.gitkraken.com/

■ GitHub Máy tính để bàn: https://desktop.github.com/

■ SmartGit: https://www.syntevo.com/smartgit/

• CLI: git - https://git-scm.com/downloads

5
Phát triển ứng dụng web
Machine Translated by Google

Bộ công cụ Web cho Môi trường Địa phương

• LARAGON: https://laragon.org/download/

• Bao gồm: Apache 2.4, Nginx, MySQL 5.7, PHP 7.4, Redis, Memcached, Node.js 14, npm, git

• Hỗ trợ: Window 64 | 32 bit

Phòng thí nghiệm S3.

6
Phát triển ứng dụng web
Machine Translated by Google

Bộ công cụ Web cho Môi trường Địa phương

• XAMPP:
WAMP: https://www.wampserver.com/en/
https://sourceforge.net/projects/xampp/

• Bao gồm: Máy chủ web Apache, cơ sở dữ liệu Mysql, công cụ PHP

• Hỗ trợ: Window 64 | 32 bit

• Bao gồm: Máy chủ web Apache, cơ sở dữ liệu Mysql, công cụ PHP, Perl

• Hỗ trợ: Window, Linux, OS X

Phòng thí nghiệm S3.

7
Phát triển ứng dụng web
Machine Translated by Google

NodeJS, PM2
• NodeJS: https://nodejs.org/en/download/

• npm cài đặt -g pm2

Phòng thí nghiệm S3.

8
Phát triển ứng dụng web
Machine Translated by Google

Cơ sở dữ liệu: MySQL, MongoDB

• Cơ sở dữ liệu: MySQL, MongoDB

• MongoDB Server: chúng ta có thể sử dụng tài khoản miễn phí trên mongo atlas (Cloud) hoặc

tải xuống và cài đặt cục bộ

Phòng thí nghiệm S3.

https://www.mongodb.com/try/download/community

• SQL Server: chúng ta có thể sử dụng tài khoản miễn phí trên db4free (https://www.db4free.net/)

hoặc tải xuống và cài đặt cục bộ bằng laragon.

9
Phát triển ứng dụng web
Machine Translated by Google

Cơ sở dữ liệu: MySQL, MongoDB

Khách hàng MongoDB

• La bàn Mongo: https://www.mongodb.com/try/download/compass?tck=docs_compass

Phòng thí nghiệm S3.

10
Phát triển ứng dụng web
Machine Translated by Google

Cơ sở dữ liệu: MySQL, MongoDB

Máy khách MySQL

• Bàn làm việc MySQL: https://www.mysql.com/products/workbench/

Phòng thí nghiệm S3.

11
Phát triển ứng dụng web
Machine Translated by Google

Trình duyệt web

• Google Chrome: https://www.google.com/chrome/

Phòng thí nghiệm S3.

12
Phát triển ứng dụng web
Machine Translated by Google

Công cụ kiểm tra API Restful

• Người đưa thư: https://www.postman.com

Phòng thí nghiệm S3.

13
Phát triển ứng dụng web
Machine Translated by Google

Lưu trữ, Dịch vụ đám mây

• Lưu trữ chia sẻ (PHP, MySQL):

• Miễn phí: https://atwebpages.com/

• MySQL đám mây miễn phí: https://www.db4free.net/
• Bluehost, Godaddy, PAViệt Nam, …

• Đám mây miễn phí cho UI: vercel.com, netlify.com, trang github

• MongoDB đám mây miễn phí: https://www.mongodb.com/cloud/atlas

Phòng thí nghiệm S3.

• Đám mây miễn phí cho API Node JS:

• Miễn phí: heroku.com, render.com

• Microsoft Azure, Google Cloud, Amazon Cloud, ...

14
Phát triển ứng dụng web
Machine Translated by Google

Bài tập về nhà

• Chuẩn bị tất cả môi trường phát triển (có thể là cục bộ hoặc đám mây): máy chủ web,

mongodb (máy khách và máy chủ), mysql (máy khách và máy chủ), IDE, github (máy khách

và máy chủ), nodejs, trình duyệt web chrome

Phòng thí nghiệm S3.

• Tạo 2 dự án hello world cho reactjs (triển khai lên vercel) và nodejs (triển khai

để hiển thị)

• https://www.youtube.com/playlist?list=PLJo1W2q6iqxksbo7hLhmH4XF_ScqvElQH

• https://www.youtube.com/playlist?list=PLJo1W2q6iqxnT0BTF5NKBu9vfdAb4Jrkz

• Tạo trang web tĩnh đơn giản đầu tiên và triển khai nó trên máy chủ web (Vercel)

• https://www.youtube.com/watch?v=jwODqsyxD6I&list=PLJo1W2q6iqxlx7Ow_HqRtzhfjsT4Zk

G7c&chỉ số=4

15
Phát triển ứng dụng web
Machine Translated by Google

Hỏi & Đáp

Phòng thí nghiệm S3.

Cảm ơn các bạn đã lắng nghe
“Đến với nhau là sự khởi đầu; Giữ
được nhau là sự tiến bộ; Làm
việc cùng nhau là thành công.”
- HENRY FORD

16
Phát triển ứng dụng web