การสร้างแอปพลิเคชันเว็บ HTML5 แบบไดนามิกและการปรับใช้บนเว็บเซิร์ฟเวอร์ระยะไกลโดยใช้ Filezilla


ในบทความสองบทความก่อนหน้าของชุดนี้เราอธิบายวิธีตั้งค่า Netbeans ในการแจกจ่ายเดสก์ท็อป Linux เป็น IDE เพื่อพัฒนาเว็บแอปพลิเคชัน จากนั้นเราดำเนินการเพิ่มสององค์ประกอบหลักคือ jQuery และ Bootstrap เพื่อให้หน้าเว็บของคุณเป็นมิตรกับมือถือและตอบสนอง

  1. Install Netbeans and Java to Create a Basic HTML5 Application – Part 1
  2. Creating Mobile-Friendly and Responsive Web Application Using jQuery and Bootstrap – Part 2

เนื่องจากคุณจะไม่ค่อยจัดการกับเนื้อหาแบบคงที่ในฐานะนักพัฒนาตอนนี้เราจะเพิ่มฟังก์ชันการทำงานแบบไดนามิกให้กับหน้าพื้นฐานที่เราตั้งค่าใน ส่วนที่ 2 ในการเริ่มต้นให้เราแสดงรายการสิ่งที่จำเป็นต้องมีและแก้ไขก่อนที่จะดำเนินการต่อ

เพื่อทดสอบแอปพลิเคชันแบบไดนามิกในเครื่องพัฒนาของเราก่อนที่จะนำไปใช้กับเซิร์ฟเวอร์ LAMP เราจะต้องติดตั้งแพคเกจบางอย่าง เนื่องจากเราใช้เดสก์ท็อป Ubuntu 14.04 เพื่อเขียนชุดนี้เราถือว่าบัญชีผู้ใช้ของคุณได้ถูกเพิ่มไปยังไฟล์ sudoers แล้วและได้รับการอนุญาตที่จำเป็น

การติดตั้งแพคเกจและการกำหนดค่าการเข้าถึงเซิร์ฟเวอร์ฐานข้อมูล

โปรดทราบว่าระหว่างการติดตั้งคุณอาจได้รับแจ้งให้ป้อนรหัสผ่านสำหรับผู้ใช้รูท MySQL ตรวจสอบให้แน่ใจว่าคุณเลือกรหัสผ่านที่รัดกุมแล้วดำเนินการต่อ

Ubuntu และตราสารอนุพันธ์ (สำหรับการกระจายแบบ ใช้เดเบียน ):

$ sudo aptitude update && sudo aptitude install apache2 php5 php5-common php5-myqsql mysql mysql-server filezilla

Fedora / CentOS / RHEL :

$ sudo yum update && sudo yum install httpd php php-common php-mysql mysql mysql-server filezilla

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

  1. Change the root password? [Y/n]. If you already set a password for the MySQL root user, you can skip this step.
  2. Remove anonymous users? [Y/n] y.
  3. Disallow root login remotely? [Y/n] y (Since this is your local development environment, you will not need to connect to your DB server remotely).
  4. Remove test database and access to it? [Y/n] y
  5. Reload privilege tables now? [Y/n] y.

สร้างฐานข้อมูลตัวอย่างและกำลังโหลดข้อมูลทดสอบ

ในการสร้างฐานข้อมูลตัวอย่างและโหลดข้อมูลทดสอบให้เข้าสู่ระบบเซิร์ฟเวอร์ DB ของคุณ:

$ sudo mysql -u root -p

คุณจะได้รับแจ้งให้ป้อนรหัสผ่านสำหรับผู้ใช้รูท MySQL

ที่พรอมต์ MySQL พิมพ์

CREATE DATABASE tecmint_db;

และกด Enter :

ตอนนี้มาสร้างตาราง:

USE tecmint_db;
CREATE TABLE articles_tbl(
   Id INT NOT NULL AUTO_INCREMENT,
   Title VARCHAR(100) NOT NULL,
   Author VARCHAR(40) NOT NULL,
   SubmissionDate TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
   PRIMARY KEY ( Id )
);

และเติมด้วยข้อมูลตัวอย่าง:

INSERT INTO articles_tbl (Title, Author) VALUES ('Installing Filezilla in CentOS 7', 'Gabriel Canepa'), ('How to set up a LAMP server in Debian', 'Dave Null'), ('Enabling EPEL repository in CentOS 6', 'John Doe');

การเพิ่มลิงก์สัญลักษณ์ในไดเร็กทอรี Web Server

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

$ sudo ln -s /home/gabriel/NetBeansProjects/TecmintTest/public_html /var/www/html/TecmintTest

จะเพิ่มลิงก์อ่อนที่เรียกว่า TecmintTest ที่ชี้ไปที่ /home/gabriel/NetBeansProjects/TecmintTest/public_html

ด้วยเหตุนี้เมื่อคุณชี้เบราว์เซอร์ของคุณไปที่ http:/localhost/TecmintTest/ คุณจะเห็นแอปพลิเคชันที่เราตั้งค่าใน ส่วนที่ 2 :

การตั้งค่า FTP ระยะไกลและเว็บเซิร์ฟเวอร์

เนื่องจากคุณสามารถตั้งค่า FTP และ เว็บเซิร์ฟเวอร์ ได้อย่างง่ายดายด้วยคำแนะนำที่ให้ไว้ในส่วนที่ 9 - ติดตั้งและกำหนดค่า Secure FTP และเว็บเซิร์ฟเวอร์ของซีรี่ส์ RHCSA ใน Tecmint เราจะ อย่าทำซ้ำที่นี่ โปรดอ้างอิงคู่มือดังกล่าวก่อนดำเนินการเพิ่มเติม