update,
This commit is contained in:
BIN
kai_871/Project.pdf
Normal file
BIN
kai_871/Project.pdf
Normal file
Binary file not shown.
7
kai_871/gitUpdate.bat
Normal file
7
kai_871/gitUpdate.bat
Normal file
@@ -0,0 +1,7 @@
|
||||
git status .
|
||||
|
||||
@pause
|
||||
|
||||
git add .
|
||||
git commit -m"update kai_871,"
|
||||
start git push
|
130
kai_871/notes.md
Normal file
130
kai_871/notes.md
Normal file
@@ -0,0 +1,130 @@
|
||||
# notes
|
||||
|
||||
## You are required to build:
|
||||
|
||||
- RESTful web services for search and maintenance of “Information of Automated Teller Machines of retail banks” provided by the Hong Kong Monetary Authority.
|
||||
- A web-based application as a client to the RESTful web services in (1). The client offers enquiries, visualization and maintenance of the information of ATM.
|
||||
|
||||
## Additional requirements that must be fulfilled are:
|
||||
|
||||
- The data returned by the web services must be in JSON format. No client-side formatting instructions (such as HTML tags) are allowed to be included in the JSON returns. The RESTful web services must be implemented with PHP. For storing ATM information, you may use local MySQL database or a cloud-based database platform at your own choice.
|
||||
|
||||
- The client must employ significant JavaScript for AJAX and DOM manipulations so as to improve user experience. Refreshing and reloading of client pages must be severely limited. In other words, a Single Page Application (SPA) is expected.
|
||||
|
||||
## This coursework consists of FOUR parts, which are specified in subsequent sections.
|
||||
|
||||
### Part 1: Data Conversion (10%)
|
||||
|
||||
https://data.gov.hk/en-data/dataset/hk-hkma-bankbranch-banks-atm-locator
|
||||
|
||||
You are required to develop a server-side command tool to get the dataset from the link above and store the data into a database. Your tool must download,
|
||||
convert and
|
||||
store the data records
|
||||
on the fly without human intervention.
|
||||
|
||||
In other words, you are not allowed to download and save the dataset as a local file, then convert and insert the records into the database by issuing separate commands.
|
||||
|
||||
Instead of issuing commands, you may include the functionality in this part in your client application (see Part 3)
|
||||
|
||||
The dataset is available in three languages: English, Traditional Chinese and Simplified Chinese. While it is mandatory for your web application to support English, you may opt to support Chinese too (see Section 3.4).
|
||||
|
||||
- Design the database schema carefully and make sure that it matches the dataset and supports the server APIs. You are advised to include a unique ID for every record.
|
||||
|
||||
- Shown below are the first few records and the last record in the dataset in English
|
||||
|
||||
### Part 2: Design & Implementation of RESTful Web Services (Total 30%)
|
||||
|
||||
You are required to develop RESTful web services that allow retrieval and maintenance of ATM records in your database constructed in Part 1. The data sent from your server to its clients must be in JSON format.
|
||||
|
||||
NOTE:
|
||||
|
||||
- PHP must be used in implementing the web services and no high-level framework such as CodeIgniter and Laravel can be used.
|
||||
|
||||
GET / PUT / POST / DELETE
|
||||
|
||||
2.1 Further note on service invocations
|
||||
|
||||
2.2 Further note of data format
|
||||
Any data returned from the server to clients must be in JSON format. Shown below is a possible return from the server when the client has requested a list of ATMs of the Bank of China in the Yuen Long district.
|
||||
|
||||
2.3 Error Handling (5%)
|
||||
|
||||
e.g. http://www.myserver.com/atm?district=Tsuen+Wan
|
||||
|
||||
### Part 3: Client-side Application (Total 30%)
|
||||
|
||||
#### 3.1 Web application to enable retrieval of information on ATM records (10%)
|
||||
|
||||
Design and implement a Single Page Application (SPA) that uses the RESTful services implemented in Part 2. Your application should provide an interface for users to enter the retrieval criteria like service hours and location district.
|
||||
As a SPA, refreshing and reloading of the entire page is prohibited. Instead, JavaScript, AJAX and DOM manipulations should be used to make requests, retrieve server replies, and updates web contents for displaying retrieval results.
|
||||
|
||||
NOTE:
|
||||
|
||||
- The client-side application must be written in HTML and JavaScript.
|
||||
- Use of UI libraries such as Semantic UI and Bootstrap are allowed but only limited
|
||||
for providing UI effects and input form validations.
|
||||
- The use of jQuery is only limited for UI effects. The use of jQuery for making AJAX
|
||||
requests to server APIs is strictly prohibited.
|
||||
- The use of high-level frameworks for application generation or completing a server
|
||||
request cycle is strictly prohibited.
|
||||
|
||||
3.2 Web application to maintain information on ATM records (10%)
|
||||
Your application should provide web pages to allow maintenance of ATM records including addition of a new ATM, removal of an existing ATM, and update of ATM details. The maintenance functions must employ the RESTful services implemented in Part 2.
|
||||
|
||||
NOTE:
|
||||
|
||||
- The pages for maintenance of ATM records can be separated from the retrieval page in (3.1) as they are essentially different functionalities. However, excessive refreshing and reload should still be avoided for ensuring better user experience.
|
||||
|
||||
#### 3.3 Usability and User Experience (5%)
|
||||
|
||||
You have to design the operation flow very carefully. For example, a typical operation is to search for ATMs in a specific district, then select one of the listed ATMs for viewing the details. A very bad design is to request the user to remember the ID or other fields and go to another page for viewing the details by entering the ID or other fields again.
|
||||
|
||||
#### 3.4 Challenging features (5%)
|
||||
|
||||
You are encouraged to design and implement challenging features besides those stated above, such as locations of ATMs on a Google Map, path going to a selected ATM, support of Chinese, etc.
|
||||
|
||||
NOTE:
|
||||
|
||||
- When you design the user interface in the client application, make sure that it is user-friendly and is consistent in its appearance in terms of styles, font sizes, and the use of colours. The operations must also be intuitive to novice users.
|
||||
|
||||
### Part 4: Presentation, Demonstration and Documentation (30%)
|
||||
|
||||
Presentation (5%):
|
||||
|
||||
- You are required to deliver a 5-minute PPT presentation on what you have done, the design of the server API, tools and techniques employed, critical evaluation, further enhancement, etc.
|
||||
|
||||
Demonstration (5%):
|
||||
|
||||
- You are required to deliver a 10-minute demonstration on your application, including the server-side data conversion program, the server APIs and the client-side application.
|
||||
- For the server APIs, you need to use Postman or similar tools to make requests to the server and to show the JSON returns from the server, including both normal data and error codes/messages.
|
||||
- Note that it will be the students to lead the entire demonstration to show the functions and features rather than the marker to guide it.
|
||||
|
||||
Report (20%)
|
||||
|
||||
- You are required to submit a written report to document the design and technical details of your application.
|
||||
|
||||
### You have to submit THREE items listed below.
|
||||
|
||||
(1) Presentation PPT
|
||||
(2) Source Code:
|
||||
|
||||
- Submit all source files including the server codes, SQL for creating and
|
||||
manipulating the database, and client-side codes (HTML, js, images, etc.). If you
|
||||
have employed any external libraries, they must also be submitted.
|
||||
- Organize the files into appropriate folders with self-explaining folder names.
|
||||
- Compress all source files and folders into one single ZIP file (zip only, rar and 7zip
|
||||
NOT allowed).
|
||||
- Submit the ZIP file to Moodle before the deadline.
|
||||
- The submitted source codes MUST BE THE SAME as those used in the
|
||||
demonstration.
|
||||
(3) Report:
|
||||
- Submit the report to Moodle before the deadline.
|
||||
- Only MS-Word or PDF formats are allowed.
|
||||
|
||||
Submittion:
|
||||
(1) Presentation PPT
|
||||
(2) Source Code
|
||||
(3) Report
|
||||
|
||||
multilinghal: english / chinese
|
||||
laravel + react(SPA)
|
7
majkp23/gitUpdate.bat
Normal file
7
majkp23/gitUpdate.bat
Normal file
@@ -0,0 +1,7 @@
|
||||
git status .
|
||||
|
||||
@pause
|
||||
|
||||
git add .
|
||||
git commit -m"update majkp23,"
|
||||
start git push
|
36
majkp23/notes.md
Normal file
36
majkp23/notes.md
Normal file
@@ -0,0 +1,36 @@
|
||||
### How it works
|
||||
|
||||
1. It's similar to ChatGPT, but simpler. User can sign in, sign out and store conversations with LLM model
|
||||
Q: 3rd-party auth provider (e.g. google auth) ?
|
||||
|
||||
2. Important: It should be able to use Azure API for GPT, because next week OpenAI closes access to Hong Kong.
|
||||
|
||||
3. You can have a conversation like in ChatGPT, you can type it or dictate it to microphone, it will be sent to Whisper API (Azure supports it)
|
||||
4. Answer will be received from API, and attached with audio that will be generated by eleven labs API.
|
||||
It needs to detect the language, so if the answer is in Spanish, then audio will be Spanish.
|
||||
If Japanese - japanese audio, etc. you can continue the conversation, so it has a context of this conversation for next answer
|
||||
5. Audio is looped in browser by default using simple HTML <loop>.
|
||||
|
||||
Remarks: LangChain can be use but the answer from ai-api will be provided as is for below api
|
||||
|
||||
- azure api,
|
||||
- whisper api,
|
||||
- eleven labs api
|
||||
|
||||
6. Answers are stored in server - and audios too, and can be obtained via rest api, and also from this simple web ui
|
||||
Remarks: ChatGPT ui alike will be provided
|
||||
Q: ui example for audios part ? for rest-api, any server provided (e.g storage) ?
|
||||
|
||||
7. You can use any server framework like node.js, same for frontend - react for instance
|
||||
Q: will your side cover related azure and api fee in develop/bug-fix stage ?
|
||||
|
||||
### Details needed from a contractor
|
||||
|
||||
1. Name and surname
|
||||
2. HKID number
|
||||
Q: only first 4 digit of HKID number (eng including) provided is that OK ?
|
||||
|
||||
Q: 唐突一問你呢份係功課黎?!
|
||||
|
||||
what is the level of completion of your project (POC) ?
|
||||
any chance if i leave you my company contact instead of HKID ?
|
BIN
majkp23/spec.png
(Stored with Git LFS)
Normal file
BIN
majkp23/spec.png
(Stored with Git LFS)
Normal file
Binary file not shown.
Reference in New Issue
Block a user