Technology Empowerment Team
Form 3 ~ 6 Potential Course
2023-2024
Floor 4 - Computer Room
Mr. Peter
Outline

1
2
Connect to the server
Development with AI
1.1.
Design your home page
1.2.
Comment board
1.3.
Login function & interface
Server
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
Create AI Robots
Tasks:

HTML & CSS Expert Robot

jQuery Expert

PHP Expert Robot
Design your home page
Tasks:
Open the home page file "index.html"
1.
2.
Create a robot that capable of web design and web development
-
Think about your home page design and list requirements to ask the AI to develop the interface
-
Usually, home page should include the introduction, your hobbies, interests or favorite.
3.
Ex24 - Comment Board

Observe the interface and functions of the webpage
Ex24 - Comment Board
Tasks:
Create a folder called "Ex23"
1.
Create a file called "index.html" under the "Ex23" folder
2.
Ask the AI Chatbot to create an interface of comment board, including the input box, delete button for each task, edit button for each task, and the time of adding the task.
3.
4.
Ask the AI to provides functions into the interface, you can tell the robot to write comments on each code to understand the meaning of the program that AI provide. And also, you can tell the AI to improve the program if some error occur.
5.
You need to ask AI to write the server side programming, you need to use JSON file to store the tasks, people can see your tasks if other computer visit your site and they may leave a comment in you site.
Ex25 - Login Function
Tasks:
- Once you implement the todo list web app with interact with the server side to store your todo tasks in the server using JSON file, you can develop a login page and only allow user who login the account to visit your todo task page.
- You can store the authorization information in a JSON file and check it if user need to login. Just use PHP and ask the AI to do it.
Technology Empowerment Team - Web development
By Mr Peter
Technology Empowerment Team - Web development
- 212