Web Development

網站系統開發課程
助您用科技解決問題 三大後台製作方案
(PHP + Node + Python)

可以協助完成NCC final year project

課程簡介

Diploma in Web System Development
(Front End + Back End Solutions)

掌握三大後台及兩大前台製作方案,可以因應客戶需要作出專業選擇

後台製作方案 1 -
PHP + MySQL

這是最傳統及最流行的網站系統開發方案, 首先設計關聯式資料庫 (Relational Database), 然後利用 PHP server side language 去處理前端 (Front end) 瀏覽器客戶的查詢, 因應需求去存取資料庫的資料,然後再產生網頁或 JSON 資料傳送回客戶端, 讓客戶端的瀏覽器顯示或者處理傳送回的資料。 全球大部分的 CMS網站內容管理系統 (WordPress, Drupal) 均會此等模式運作。

  • Image Icon

    Become a PHP and MySQL Web Developer

後台製作方案 2 -
Node + MongoDB

是一個新進的後台製作方案,特色是利用一套程式語言 JavaScript 便可開發前台及後台的所有功能。 Node.JS 可配搭不同類型的資料庫, 如果配搭 NoSQL Database (MongoDB) 便可以方便網站系統無限擴張 (scalable), 突破傳統資料庫的限制。此方案亦方便用家設計 Web Service,透過 REST API 設計風格,便可 讓瀏覽器或流動應用程式 (Mobile Apps) 直接接駁存取資料。

  • Image Icon

    Become a NodeJS and MongoDB Developer

後台製作方案 3 -
Python + Django

隨著Python語言的興起,學習Python 除了可以用在資料分析及機械學習之外, 亦可利用 Python 開發網站系統。可以配搭最著名的 Django Web 應用框架, 採用了MTV(model–template–views)的軟件設計模式。 可以以很快的速度建立全功能的網站, 通常配搭 SQLite 資料庫。這方案亦方便讓建立完成的機械模型 (Machine Learning Model) 放在此框架上。 方便使用者測試及使用。

  • Image Icon

    Become a Python and Django Developer

前台製作方案 1 -
HTML5 + CSS3 + jQuery + BootStrap

前台網頁的基礎是由 HTML5, CSS3 及 Javascript所組成。為了加速開發 Javascript語言, 我們可利用 jQuery程式庫協助,簡化JavaScript的編寫。同時為了加快美化網站的速度及製作 Responsive 網站, 我們也能使用 BootStrap CSS Framework協助,可以輕鬆構建響應式網站。

  • Image Icon

    Become a HTML5, CSS3, jQuery and BootStrap Web Developer

前台製作方案 2-
ReactJS

React JS 是由 faceBook(Meta) 所開發的前端介面設計 Javascript工具庫, 是用介面組件(Components) 這觀念用來架構介面。 概念是將網頁切割成不同的 component, 每個component包含自己的網頁內容,設計風格及相關程式碼, 網站人員便可以輕鬆利用 component 組成不同的網站設計,使前台開發更有規模以及更容易管理。開發者可自行開發組件或利用已經建立的第三方組件用來建構網站, 是最先進的 Web design 技術及趨勢。

  • Image Icon

    Become a ReactJS Developer

前後台整合範例 -
React + Node + Cloud

我們會利用望 MongoDB NoSQL 資料庫儲存文件,不再侷限於資料表格的規範。 利用 NodeJS 及 Express 建立網站的後台系統,透過各種各樣的 Modules 和 Middleware 輕鬆配搭出不同類型的後台系統需要。 前台系統則使用 ReactJS 寫出豐富及反應敏捷的以 Component 為主要設計單位的系統,配合不同的 hooks 來加強前台系統的功能。 再利用 REST API 透過 REST API 將前後台功能整合起來。 最後更將MongoDB資料庫,NodeJS後台及 ReactJS前台三部分分別移上雲端服務,令系統能開放給大眾使用。。

  • Image Icon

    Become a React and Node Developer

課程結構

本課程由6個教授部分所組成 (共有 9 堂面授課程 + 44 小時視頻課程)。學員可因應自己需求導讀個別單元或整個課程

About Images

Face to Face + Video Lessons

Icons Images
About Images
Icons Images
About Images
Icons Images
About Images
About Images

Video Lessons

Icons Images
About Images
Icons Images
About Images
Icons Images
About Images


課程內容

Back End

PHP + MySQL

3 堂面授課程 + 7.5 小時課程錄影

這是最傳統及最流行的網站系統開發方案, 首先設計關聯式資料庫 (Relational Database), 然後利用 PHP server side language 去處理前端 (Front end) 瀏覽器客戶的查詢, 因應需求去存取資料庫的資料,然後再產生網頁或 JSON 資料傳送回客戶端, 讓客戶端的瀏覽器顯示或者處理傳送回的資料。 全球大部分的 CMS網站內容管理系統 (WordPress, Drupal) 均會此等模式運作。

About Images

Author Images

Certificate in PHP and MySQL Web Development (CPM2023)

適合初學者修讀,無需任何經驗,由淺入深教學

  • 25th Sept 2023
  • 7:30pm - 9:30pm
  • Every Friday
  • 3 lessons

$1,680

Enroll Online

What you can learn ?

  • Learn how to design the relational database using MySQL
  • Learn how to use the primary and foreign key constraints
  • Learn how to write PHP server side languages
  • Learn how to use PHP to connect to the database
  • Learn how to create the function of adding records
  • Learn how to create the function of listing records
  • Learn how to create the function of deleting records
  • Learn how to create the function of updating records
  • Learn how to upload the file using forms
  • Learn how to use the cookies and sessions for security
  • Learn how to setup the authentication system
  • Learn how to setup the authorization system
PHP
TechnologyIntroduction
PHP PHP是一個應用範圍很廣的語言,特別是在網路程式開發方面。一般來說PHP大多在伺服器端執行,透過執行PHP的程式碼來產生網頁提供瀏覽器讀取。 PHP可以在許多的不同種的伺服器、作業系統、平台上執行,也可以和許多資料庫系統結合。
MySQL MySQL 是一個開放源碼的關聯式資料庫管理系統,MySQL在過去由於性能高、成本低、可靠性好,已經成為最流行的開源數據庫,因此被廣泛地應用在 Internet上的中小型網站中。隨著MySQL的不斷成熟,它也逐漸用於更多大規模網站和應用,比如維基百科、Google和Facebook等網站。

COURSE OUTLINE

  • Environment Setup - Setup Apache Web Server, PHP Engine and MySQL Database
  • Create a MySQL database and design basic database table
  • Understanding Primary Key and Foreign Key Constriants
  • Select, Insert, Update and Delete data in the table
  • Draw the ER diagram for database design
  • One to One, One to Many and Many to Many relationships implementation
  • Table joining and building View for Query

  • PHP Language Basics and Functions<
  • PHP Variables and Arrays data structure
  • PHP If-Else Decision Making and Looping Control structure
  • Connecting MySQL Database Connection using PHP
  • Build a user registration form using POST and GET
  • Validate user data and responds with error messages
  • Build a image upload form for uploading image or files

  • Build the Update functions for the system
  • Build the Delete functions for the system
  • Build the Search functions for the system
  • Implement login mechanism for the system
  • Understanding the Cookies and Session
  • Use the Cookie and Session to secure web pages
  • Build the authorization function for the system

Back End Development

Node + MongoDB

3 堂面授課程 + 7.5 小時課程錄影

NodeJS 是一個新進的後台製作方案,特色是利用一套程式語言 JavaScript 便可開發前台及後台的所有功能。 NodeJS 可配搭不同類型的資料庫, 如果配搭 NoSQL Database (MongoDB) 便可以方便網站系統無限擴張 (scalable), 突破傳統資料庫的限制。此方案亦方便用家設計 Web Service,透過 REST API 設計風格, 便可讓瀏覽器或流動應用程式 (Mobile Apps) 直接接駁存取資料。

About Images

Author Images

Certificate in Node and MongoDB Web Development (CNM2023)

適合初學者修讀,無需任何經驗,由淺入深教學

  • 28th Sept 2023
  • 7:00pm - 9:30pm
  • Every Friday
  • 3 lessons

$1,680
Enroll Online

What you can learn ?

  • Learn how to use new JavaScript features
  • Learn how to setup the NodeJS project and its modules
  • Learn how to setup the Express web server
  • Learn how to design the NoSQL database (MongoDB)
  • Learn how to create the collections and documents
  • Learn how to use the MVC architecture
  • Learn how to connect to use Mongoose to connect database
  • Learn how to use the middlewares to enhance functions
  • Learn how to use the controllers for separating functions
  • Learn how to use the CRUD operations with the database
  • Learn how to use the sessions for security
Python
TechnologyIntroduction
NodeJS NodeJS 是一個 Javascript 執行環境, 讓開發者可利用 Javascript開發後台系統。 使用者可以不再學習其他語言便可利用 Javascript一併開發前後台程式。 再配合強大的程式庫,可架構出任何種類的 Server 架構。
MongoDB MongoDB 是一個以文件導向的資料庫架構, 開發者不用預先設定資料庫結構。使用者可隨意新增及刪除文件。 文件的格式亦可以隨意改變,適合大數據資料儲存。

COURSE OUTLINE

  • Introducing JavaScript and its basic syntax
  • Installing NodeJS and Visual Studio Code
  • Downloading and installing various modules using npm
  • Create New NodeJS project
  • Understanding various files in NodeJS project
  • Using the basic modules like http, url and fs
  • Create a basic NodeJS web server
  • Understanding the Request and Response objects
  • Reading files and images using fs module
  • Showing different pages using url module
  • Sending Data using GET method
  • Receiving Data via Query String
  • Sending Data using POST method
  • Receiving Data via Form POST
  • Uploading files and process it using formidable module
  • Using AJAX to send data
  • Installing the Express web framework
  • Setup the static folder in Express
  • Using Express routing to load different pages

  • Understanding MongoDB (NoSQL and document based)
  • Installing the MongoDB
  • Create and Drop the Database
  • Create and Drop the Collections
  • Create Document using InsertOne and InsertMany
  • Understanding the ObjectID for each document
  • Query the Collection by using various operators
  • Sorting and Limiting the Query Result
  • Updating the document using Update, UpdateOne or UpdateMany
  • Deleting the document using DeleteOne or DeleteMany
  • Grouping the document using Aggregrate
  • Building the relationship using Embedded or Referenced Documents
  • Using NodeJS to connect MongoDB
  • Create the CRUD operation in MongoDB using NodeJS

  • Understanding the Mongoose packages for Object Data Modeling
  • Creating the Mongoose schema and model
  • Using NodeJS to connect Mongoose
  • Create the CRUD operations using Mongoose using NodeJS
  • Understanding the EJS template engines for page rendering
  • Introducing the MVC (Model + View + Controller) architecture
  • Creating various controllers for CRUD
  • Introducing the Middleware concept
  • Creating the Data Validation Middleware
  • Indroducing the Session concept
  • Form Handling and stores values in Component state
  • Using the Session to implement security
  • Create a user collection and controllers for login and logout
  • Create a middleware to protect pages which require authentication

Back End Development

Python + Django

3 堂面授課程 + 7.5 小時課程錄影

隨著Python語言的興起,學習Python 除了可以用在資料分析及機械學習之外, 亦可利用 Python 開發網站系統。 可以配搭最著名的 Django Web 應用框架, 採用了MTV(model–template–views)的軟件設計模式。 可以以很快的速度建立全功能的網站, 通常配搭 SQLite 資料庫。 這方案亦方便讓建立完成的機械模型 (Machine Learning Model) 放在此框架上。 方便使用者測試及使用。

About Images

Author Images

Certificate in Python and Django Web Development (CPD2023)

適合初學者修讀,無需任何經驗,由淺入深教學

  • 19th Oct 2023
  • 7:00pm - 9:30pm
  • Every Friday
  • 3 lessons

$1,680
Enroll Online

What you can learn ?

  • Learn how to install Python and Django
  • Learn how to create Django Views
  • Learn how to add functions to Views
  • Learn how to create Django Model
  • Learn how to migrate Model to database
  • Learn how to create Django Template
  • Learn how to pass data to Template
  • Learn how to use Template to generate web page
  • Learn how to use the Admin Site
  • Learn how to implement the CRUD operations in Django
  • Learn how to setup the authentication and authorization
Python
TechnologyIntroduction
Python Python 是一個通用的程式語言,被喻為最適合初學者修讀的程式語言。被廣泛應用在資料分析機械學習等領域。
Django Power Automate Desktop 是 Microsoft 一個免費的 RPA (Robotic Process Automation) 工具,安裝在電腦後, 便可將電腦上的工作流程自動化。

COURSE OUTLINE

  • Introducing Python and its basic syntax
  • Downloading and installing various modules using pip
  • Installing Django and create virtual environment
  • Create a new Django project
  • Understanding various files in Django project
  • Understanding the Model-View-Template (MVT) architecture
  • Create your first Django View
  • Adding functions to the View
  • Create your first Django Template
  • Passing data into the Template
  • Generating web pages using Template
  • Create your first Django App
  • Registering the app in the project
  • Using the URL to map request to functions in Views
  • Sending Form Data using POST or GET method
  • Receiving Data via Form in Views
  • Serving static files and images
  • Starting and running a dynamic web site

  • Create the first Django Model
  • Create the migrations from the Model
  • Migrate the changes to create or amend the database (SQLlite)
  • Use command line to retreive all records
  • Use command line to filter records
  • Use command line to add records
  • Use command line to update records
  • Use command line to delete records
  • Create the relationship between models (one to many and many to many)
  • Understanding the QuerySet returned
  • Showing the database data in web pages
  • Accessing the Django Admin Site
  • Registrating Models with the Admin
  • Managing users and groups in the Admin

  • Create the base template
  • Extending the base template
  • Design various apps for the final project
  • Letting users to post data via web page
  • Implementing the create data function in the web
  • Implementing the list data function in the web
  • Implementing the update data function in the web
  • Implementing the delete data function in the web
  • Implementing user authentication
  • Implementing user authorization

Front End Development

HTML5 + CSS + jQuery + BootStrap + Vue.JS + AngularJS

7.5 小時課程錄影

前台網頁的基礎是由 HTML5, CSS3 及 Javascript所組成。為了加速開發 Javascript語言, 我們可利用 jQuery程式庫協助,簡化JavaScript的編寫。同時為了加快美化網站的速度及製作 Responsive 網站, 我們也能使用 BootStrap CSS Framework協助,可以輕鬆構建響應式網站。

About Images

Author Images

Certificate in HTML5, CSS3, jQuery, Bootstrap and VueJS Web Development (CHS2023)

適合初學者修讀,無需任何經驗,由淺入深教學

  • 12.5 hrs
  • Video Course

$1,680
Enroll Online

What you can learn ?

  • Learn how to design web page using HTML
  • Learn how to style web page using CSS
  • Learn how to use JavaScript for interaction
  • Learn how to use jQuery for simplifying JavaScript
  • Learn how to use BootStrap for simplifying styling
  • Learn how to use AJAX to send web requests
  • Learn how to use JSON as the data format
  • Learn how to use VueJS for front end design
  • Learn how to use AngularJS for front end design
  • Learn how to use component web design using VueJS
  • Learn how to use component web design using AngularJS
Front End 1
TechnologyIntroduction
HTML5 HTML5是最新版本的HTML,可以準確描述出網頁的內容及外觀。HTML5利用JavaScript解決了瀏覽器兼容性的問題,並且引入多媒體及不同類型Tags增強結構及可讀性。
CSS3 CSS3 是一套美化網頁既語言,利用CSS我們可以加入不同的美化效果。例如背景圖畫、邊框、顏色、動畫效果及各種設計元素。
JavaScript Javascript是運行於瀏覽器上的程式語言 自從Google的v8引擎出現後,JavaScript的效能得到大大的提升 令我們可以在網頁上創造出不同的互動效果
jQuery jQuery是一套跨瀏覽器的JavaScript函式庫,簡化HTML與JavaScript之間的操作,是目前最受歡迎的JavaScript函式庫。
Bootstrap BootStrap 是一套跨瀏覽器的CSS framework ,可快速製作出適合不同裝置及尺寸的回彈性網頁介面。
VueJS VueJS 是漸進式JavaScript框架。 利用組件設計(Component Design)來設計Web前端, 是今年最流行的前端框架之一,為開發人員必須學習的新設計方式

COURSE OUTLINE

  • HTML Basic Tags (Header, Hyperlink, Paragraph, Table, Image)
  • HTML Layout using DIV tags
  • CSS basic styling commands and cascading concepts
  • CSS ID and class concepts
  • CSS Box Model (Background and Border styling)
  • CSS Color schemes and Google fonts
  • CSS Menu bar makeup

  • JavaScript Basics and Functions
  • JavaScript Variables and Constant
  • JavaScript If-Else Decision Making and Looping Control structure
  • JavaScript data structure (Array and Objects)
  • DOM (Document Object Model) introduction
  • Interacting DOM by JavaScript

  • jQuery Basic Sytnax
  • Interacting DOM with jQuery
  • AJAX communication with Server by jQuery
  • Using AJAX to submit form and download JSON data
  • BootStrap Grid system for Responsive Web Design
  • BootStrap classes for building different Components
  • BootStrap for styling a form and table

  • Introduction of Component Based design as the next generation of Web Design
  • Introduction of VueJS and AngularJS frameworks
  • VueJS and AngularJS Environment Setup
  • Understanding VueJS and AngularJS component and instance
  • Using Inline Styling and Directives
  • Method binding in VueJS and AngularJS


Front End Development

React + BootStrap

7.5 小時課程錄影

React JS 是由 faceBook(Meta) 所開發的前端介面設計 Javascript工具庫, 是用介面組件(Components) 這觀念用來架構介面。 概念是將網頁切割成不同的 component, 每個component包含自己的網頁內容,設計風格及相關程式碼, 網站人員便可以輕鬆利用 component 組成不同的網站設計,使前台開發更有規模以及更容易管理。開發者可自行開發組件或利用已經建立的第三方組件用來建構網站, 是最先進的 Web design 技術及趨勢。

About Images

Author Images

Certificate in ReactJS Web Deveopment (CRE2023)

適合初學者修讀,無需任何經驗,由淺入深教學

  • 10 hrs
  • Video Course

$1,680
Enroll Online

What you can learn ?

  • Learn what is ReactJS
  • Learn the new features of JavaScript
  • Learn how to design a React component
  • Learn how to use JSX for rendering
  • Learn how to use props to pass information
  • Learn how to use state for storing states
  • Learn how to use Promise and axios to send request
  • Learn how to use design ReactJS component tree
  • Learn how to use various hooks to enhance functions
  • Learn how to use React router to load components
  • Learn how to use React Bootstrap to style web pages
Front End 2
TechnologyIntroduction
ReactJS ReactJS 是由 faceBook(Meta) 所開發的前端介面設計 Javascript工具庫, 是用介面組件(Components) 這觀念用來架構介面。 開發者可自行開發組件或利用已經建立的第三方組件用來建構網站, 是最先進的 Web design 技術及趨勢
Bootstrap BootStrap 是一套跨瀏覽器的CSS framework ,可快速製作出適合不同裝置及尺寸的回彈性網頁介面。

COURSE OUTLINE

  • Create New React Project
  • Understanding various files in React Project
  • Introducing React Component
  • Create your first React Component
  • Introducing JSX (JavaScript XML) as the rendering language
  • Rendering variables and functions in JSX
  • Using map functions to render array and objects
  • Conditionally Rendering Components

  • Create State in Components using useState hook
  • Avoiding Infinite Rendering by incorrect function calls
  • Form Handling and stores values in Component state
  • Building the Component Tree using Child Components
  • Export and Import the Components
  • Execute functions automatically using useEffect hook
  • Fetching remote using fetch and axios libraries
  • Understanding the concept of Promise object
  • Testing how to call the public remote API

  • Using useRef to persist values between rendering
  • Using useRef to access DOM elements
  • Using createContext and useContext to build global state
  • Understanding Facebook's Flux pattern
  • Using useReducer to implement the Flux pattern
  • Using useMemo and useCallback to avoid unnecessary rendering
  • Using React Router to load different components
  • Setup the Routing Tables
  • Adding the Link for loading each component
  • Passing data by useLocation and useParams hooks
  • Using React Bootstrap to style the components


Front End + Back End Development

Node + MongoDB + React + Heroku

7.5 小時課程錄影

我們會利用望 MongoDB NoSQL 資料庫儲存文件,不再侷限於資料表格的規範。 利用 NodeJS 及 Express 建立網站的後台系統,透過各種各樣的 Modules 和 Middleware 輕鬆配搭出不同類型的後台系統需要。 前台系統則使用 ReactJS 寫出豐富及反應敏捷的以 Component 為主要設計單位的系統, 配合不同的 hooks 來加強前台系統的功能。 再利用 REST API 透過 REST API 將前後台功能整合起來。 最後更將MongoDB資料庫,NodeJS後台及 ReactJS前台三部分分別移上雲端服務,令系統能開放給大眾使用。。

About Images

Author Images

Certificate in Node and React Web Development (CNR2023)

本部分為視像課程, 學員需具備 Node, MongoDB 和 React基本知識。

  • 3.5 hrs
  • Video Course

$1,280
Enroll Online

What you can learn ?

  • Learn what is the MERN stack
  • Learn how to setup the NodeJS project
  • Learn how to setup the MongoDB and Mongoose
  • Learn how to setup the models to connect database
  • Learn how to setup the ReactJS project
  • Learn how to setup the REST API in NodeJS
  • Learn how to call the REST API in ReactJS
  • Learn how to setup the controllers to handle requests
  • Learn how to setup the CRUD functions
  • Learn how to deploy the back end to Heroku cloud
  • Learn how to deploy the front end to Netify cloud
Project
TechnologyIntroduction
NodeJS NodeJS 是一個 Javascript 執行環境, 讓開發者可利用 Javascript開發後台系統。 使用者可以不再學習其他語言便可利用 Javascript一併開發前後台程式。 再配合強大的程式庫,可架構出任何種類的 Server 架構。
ReactJS ReactJS 是由 faceBook(Meta) 所開發的前端介面設計 Javascript工具庫, 是用介面組件(Components) 這觀念用來架構介面。 開發者可自行開發組件或利用已經建立的第三方組件用來建構網站, 是最先進的 Web design 技術及趨勢
MongoDB MongoDB 是一個以文件導向的資料庫架構, 開發者不用預先設定資料庫結構。使用者可隨意新增及刪除文件。 文件的格式亦可以隨意改變,適合大數據資料儲存。
ExpressJS Express 是 NodeJS 上一個最出名及最多人使用的 Web Server程式庫。 透過樣板 (Template) 能建構出各種各類的網頁。 開發者能夠輕易透過路由系統 (Routing) 建立各種網絡 REST API, 讓使用者能夠輕鬆存取背後的資料庫。
MongoDB Altas 是一個用來安置 MongoDB 資料庫的雲端服務
HeroKu HeroKu (在Amazon AWS 上構建) 是一個用來安置各種後台系統的雲端服務而
Netify Netify 是一個用來安置各種前台系統的雲端服務

COURSE OUTLINE

  • Design the system architecture for the complete system
  • Create the NodeJS backend system
  • Installing the CORS module for cross domain API calls
  • Installing the Express-Upload module for file upload
  • Create an registration database and create the Mongoose models
  • Create the API for retreiving all the registrations
  • Create the API for retreiving a single registration
  • Create the API for deleting the registration
  • Create the API for updating the registration
  • Create the API for adding the registration

  • Create the ReactJS frontend system
  • Set the Environment Variables
  • Create the Component for listing all the registration
  • Create the Component for showing the single registration
  • Create the Component for adding a new registration
  • Create the Component for searching the registration
  • Create the Component for updating the registration

  • Porting the Mongodb database to the cloud service (Mongodb Altas)
  • Registering an account in Mongodb Altas
  • Setup the database and the access permission
  • Connecting the NodeJS to use the remote database
  • Porting the NodeJS backend to the cloud service (Heroku)
  • Registering an account in Heroku
  • Prepare the NodeJS project for uploading
  • Deploying the NodeJS backend using Git
  • Porting the ReactJS frontend to the cloud service (Netify)
  • Registering an account in Netify
  • Build the production version of the ReactJS frontend
  • Deploing the ReactJS frondend to Netify


Diploma in Web System Development (Back End and Front End)

由淺入深逐步了解網站開發的各種技巧

  • Back End Solution 1 - PHP + MySQL
  • Back End Solution 2 - NodeJS + MongoDB
  • Back End Solution 3 - Python + Django
  • Front End Solution 1 - HTML5 + CSS3 + jQuery + BootStrap + VueJS + AngularJS
  • Front End Solution 2 - ReactJS + BootStrap
  • Back End + Front End Project - NodeJS + ReactJS Integration Project

對於專業網站開發程式員來說, 會因應客戶需要而製定出不同的開發方案。 本課程集合了不同的前後台開發方案供學員參考, 令學員可成為更全面的開發人員。

Card image

本課程的目標是培訓全面的網站開發專才。 課程分為多部分, 學員可選擇報讀個別單元, 亦可選擇一次報讀所有單元。

除了即時面授課程之外, 亦會有課堂錄影片段可供回顧。 觀看期為期一年, 學員可無限重溫重播。

你將會學到


PHP and MySQL

  • Learn how to design the relational database using MySQL
  • Learn how to use the primary and foreign key constraints
  • Learn how to write PHP server side languages
  • Learn how to use PHP to connect to the database
  • Learn how to create the function of adding records
  • Learn how to create the function of listing records
  • Learn how to create the function of deleting records
  • Learn how to create the function of updating records
  • Learn how to upload the file using forms
  • Learn how to use the cookies and sessions for security
  • Learn how to setup the authentication system
  • Learn how to setup the authorization system

Node + MongoDB

  • Learn how to use new JavaScript features
  • Learn how to setup the NodeJS project and its modules
  • Learn how to setup the Express web server
  • Learn how to design the NoSQL database (MongoDB)
  • Learn how to create the collections and documents
  • Learn how to use the MVC architecture
  • Learn how to connect to use Mongoose to connect database
  • Learn how to use the middlewares to enhance functions
  • Learn how to use the controllers for separating functions
  • Learn how to use the CRUD operations with the database
  • Learn how to use the sessions for security

Python + Django

  • Learn how to install Python and Django
  • Learn how to create Django Views
  • Learn how to add functions to Views
  • Learn how to create Django Model
  • Learn how to migrate Model to database
  • Learn how to create Django Template
  • Learn how to pass data to Template
  • Learn how to use Template to generate web page
  • Learn how to use the Admin Site
  • Learn how to implement the CRUD operations in Django
  • Learn how to setup the authentication and authorization

HTML5 + CSS + jQuery + BootStrap + VueJS + AngularJS

  • Learn how to design web page using HTML
  • Learn how to style web page using CSS
  • Learn how to use JavaScript for interaction
  • Learn how to use jQuery for simplifying JavaScript
  • Learn how to use BootStrap for simplifying styling
  • Learn how to use AJAX to send web requests
  • Learn how to use JSON as the data format
  • Learn how to use VueJS for front end design
  • Learn how to use AngularJS for front end design
  • Learn how to use component web design using VueJS
  • Learn how to use component web design using AngularJS

ReactJS + BootStrap

  • Learn what is ReactJS
  • Learn the new features of JavaScript
  • Learn how to design a React component
  • Learn how to use JSX for rendering
  • Learn how to use props to pass information
  • Learn how to use state for storing states
  • Learn how to use Promise and axios to send request
  • Learn how to use design ReactJS component tree
  • Learn how to use various hooks to enhance functions
  • Learn how to use React router to load components
  • Learn how to use React Bootstrap to style web pages

Node + MongoDB + React Integration

  • Learn what is the MERN stack
  • Learn how to setup the NodeJS project
  • Learn how to setup the MongoDB and Mongoose
  • Learn how to setup the models to connect database
  • Learn how to setup the ReactJS project
  • Learn how to setup the REST API in NodeJS
  • Learn how to call the REST API in ReactJS
  • Learn how to setup the controllers to handle requests
  • Learn how to setup the CRUD functions
  • Learn how to deploy the back end to Heroku cloud
  • Learn how to deploy the front end to Netify cloud

Instructor

Dannis Mok

who has rich experience in business web and apps system development and have over 20 years of teaching experience. He has great passion in learning and teaching new technologies and his teaching style is clear to point and can explain complex technologies in simple terms. He has delivered various workshops and classes for different corporate, government departments and local universities and is the principal lecturer for NCC Education and University of Greenwich. Besides BSc degree in IT, he also got a MBA, MSc in IT and MSc in Telecommunication degree.

相關專業認證
  • Microsoft MCSE, MCDBA
  • Microsoft Certified System Developer
  • Microsoft Office Specialist Master
  • Cisco CCNA,CCDA,CCNP,CCDP
  • Sun Microsystems – Certified Java Programmer
  • Oracle – Certified Database Professional
  • Linux - LPI Level 1 & 2
相關教學經驗
  • 為積金局 (MPF) IT 員工提供 Android 及 iPhone 視像培訓課程
  • 為香港教育局提供 Android 培訓課程予中學電腦科導師
  • 為香港教育大學 IT 員工提供 Cordova 跨平台流動程式開發課程
  • 為房屋署員工 IT 員工提供 HTML5 跨平台流動程式開發課程
  • 為房屋署員工 IT 員工提供 Android 及 iPhone 平台流動程式開發課程
  • 為香格里拉大酒店IT 員工提供 Android 流動程式開發課程
  • 為勞工處提供 HTML5 遊戲培訓課程及電子商店培訓課程
  • 為中國銀行IT 員工提供 Android 及 iPhone 流動程式開發課程
  • 為香港郵政IT 員工提供 Angular 8 程式開發課程
  • 為 VTC 職業訓練局提供各種各類 IT 培訓課程
  • 為醫管局員工 IT 員工提供跨平台流動程式開發課程

視像課程內容

視像課程部分共有40小時,部分片段為其他班上堂的錄影片段,部分片段則是導師額外預先錄影的片段。 學員有充裕的時間去不斷重溫及重播相關技術課程片段,務求令自己掌握相關技術。請登入網上學習系統觀看。

登入戶口: demoweb

登入密碼: demopass

LOGIN

Diploma in Web System Development (Back End and Front End Solutions)

綜合課程學費: $4,900 $9,680
Package Discount
  • 面授課程9堂(22.5小時)
  • 開課時間2023-10-6 開始 五 7:00pm-9:30pm
  • 學習影片28 小時視頻課程,由淺入深教學
  • 觀看時限12個月
  • 入學要求無需任何程式設計背景,有興趣請便可報讀
  • 課程代碼:DNR06202201