This module introduces students to software development on the Web platforms. Students will be exposed to important computer science concepts, including networking, databases, computer security, user interface design, programming languages, and software engineering. These concepts will be tied together through hands-on practice in building a Web-based application using the current Web development technology. At the end of the module, students are expected to be able to design and develop a Web application, to appreciate the underlying technology needed to build a Web application, and to develop a fundamental understanding of related computer science concepts.
This module was previously known as CP3101B in Academic Years 2013/14 and 2014/15.
Note: This introductory message will not be prominent the next time you visit this URL again. This behavior is normal. You can view it again by scrolling to the top of this page. Btw, you will learn how to use HTML5
localStorage to emulate this behavior in your web application.
The quota of this class (Sem 2 AY2016/17) is 60 students, which is the same as the last three Academic Years.
There is now minor change about the pre-requisites and pre-clusions, see below.
Lab (hands-on) component with low Lab TA to students ratio and the long capstone project are critical to the success of this web programming module.
Useful information to help you decide on whether you should register for CS3226 (see CS3226 in nusmods.com):
(Senior) Lecturer: Dr Steven Halim, the key man behind VisuAlgo who created his first website 17 years ago and actively learning the latest web development techniques to keep this module up-to-date. Lectures are on Tuesdays, 10am-12pm at COM1-2-VCRm.
|Rating (out of 5.00)||Jan-Apr 2017 (n=??/43)||Jan-Apr 2016 (n=20/57)||Jan-Apr 2015 (n=24/57)|
|Module feedback||Hopefully ▲||3.800 ▼||3.958|
|Module difficulty||Hopefully =||3.850||4.083|
|Steven's teaching||Hopefully ▲||3.986 ▼||4.165|
Teaching Assistants (TAs), all lab groups are on Monday at COM1-B111 starting from Week03 onwards, we will focus on Laravel this semester:
|1||10am-12pm||Dr Steven Halim|
|2||12-2pm||Qua Zi Xian|
|3||2-4pm||Tan Mun Aw|
10am-12pm, 12-2pm, 2-4pm
|01, 10 Jan||N/A yet||
Lecture01 - Introduction
Lecture02 - HTTP/S
|02, 17 Jan||N/A yet||
Lecture03 - HTML5
Lecture04 - CSS3
|03, 23+24 Jan||
Lecture05 - JS (jQuery)
Chinese New Year (CNY) on 28-29 Jan
(Monday, 30 Jan will also be a Public Holiday)
Online Lab2: First Version
(@ live web server)
Lecture06 - Front-End
(Bootstrap & Laravel Blade Templates)
05, 06+07 Feb
Lab3: Second Version
(Bootstrap & Laravel Blade Templates)
Lecture07 - PHP
(Laravel Form, Input Validation)
|06, 13+14 Feb||
Lab4: Back-End 1
(Laravel Form, Input Validation, Simple PHP)
Lecture08 - Database
(SQL/MySQL-very brief, Laravel Eloquent ORM)
No class, just do Back-End 2 lab
No class, but think of Capstone Project idea(s) too
|07, 27+28 Feb||
Lab5: Back-End 2
(Laravel Eloquent ORM,
Lecture09 - Security
Capstone Project Briefing
|08, 06+07 Mar||
Lab6: A1 and A2
Lecture10 - Performance & Scalability (1h)
Finalizing Capstone Project Ideas
|08, 10 Mar||
Steven takes parental leave 9-14 Mar (6d 5n)
Steven's Lab Group 1 is handled by Tan Mun Aw this day
Steven will not be present this day
Please use the extra 2 hours time to review these past papers (or the entire past lectures/labs)
1516SEM2-CS3226 (theoretical test)
Alternatively, you can also use this 2 hours block for another possible capstone project meeting time
|10, 20+21 Mar||Project-Iteration 1/Frontend||
Lecture11 - Web Server
Lecture12 - Miscellaneous Techniques
Long lecture with 2 topics in one session
|11, 27+28 Mar||
Additional: Test Preview (Monday)
30% Theoretical Test
(using Lecture Time)
Here is our paper:
1617SEM2-CS3226 (theoretical test)
|12, 03+04 Apr||
Project-Iteration 3/Tying loose ends
Aim to reach MVP by this Monday.
Lecture13 - The Last Lecture
|13, 10+11 Apr||Project-Last Check (Monday)||
Capstone Project Evaluation Day
(using Lecture Time)
The 10th STePS
(on Wednesday night)
Good Friday and Easter Sunday Week
|Reading Week||No class, no final assessment||No class, no final assessment|
|Lab TA||Project||Student Name|
The table below will contain direct links to selected students' works for CS3226 past labs. Try them. Also please do a 'right click' and select 'view page source' (of the client-side files) to study how your peers managed to come up with a good web application given the same constraints.
The success of module like CS3226 is best evaluated by the abilities of its graduates to produce working web applications that are useful rather than raw knowledge of the ever-changing technology stack (currently HTTP/S, HTML, CSS, JS, jQuery, Bootstrap, PHP, MySQL, Laravel, etc). If your capstone project is successful, you can proudly put a reference of it inside your Curriculum Vitae* that your prospective employer can visit before interviewing you.
Who will build the next useful web application (for NUS community or for worldwide audience) that survives the test of time (defined as this: It is still live and used by people at least one year after its launch)?
In AY 2014/15, it was NUSWhispers (still alive!!).
In AY 2015/16, it was NUS Hacks (unfortunately it has died).
How about this AY 2016/17?...
Remember that the manpower per group is [5..7] students (1-2 MORE than the previous two AYs) and the time window is approximately 5 weeks (Week09-10-11-12-13, about the same as last two AYs as we have to end the module by Wednesday of Week 13 instead of dragging it until Wednesday of Study week).
|03||Early random pairing/tripling of project groups during Lab1 (Lab1 is still done individually)|
|04-06||Work on Lab2-4 as pairs; by end of Week 06, we will do another random grouping to make up project groups of size 5-6; the usage of version control software like GitHub is recommended|
|Recess-07||Lab5-6 will be submitted according to capstone project grouping, i.e. merge the two (or three) versions into one better version per capstone project group; The capstone project group will start brainstorm possible capstone project ideas (medium sized), discuss the feasibility of such ideas with the Lab TAs or the lecturer with the lecturer having the final say. There is NO lecturer-proposed projects this time...|
|08||All proposals should be completed latest by Tuesday of Week 08 (07 March 2017) as Steven will be away on 9-14 March (end of Week 08 - mid of Week 09) and you all have to start your project anyway by Week 09... Write down your project abstract at iSTePS system directly (read these instruction slides).|
|09||Deeper Brainstorming/Prototyping week:
|10||Development work: Iteration 1, front-end and back-end have to be done in parallel, remember to manage manpower properly|
|11||Development work: Iteration 2|
Manage your time properly between individual achievement (30% theoretical test) and group work.
After the individual theoretical test is over, this module is all about 2 week push of your capstone project.
|12||Development work: Iteration 3|
For this week, I hope most capstone project groups have reached what we call MVP status...
It is better to start launching the app (invite your friends to try the app) by this week.
Please inform Steven about your app's final domain name to be linked/updated below (all done by Friday, 7 April).
Some team members must already start thinking about A1 poster (for STePS) and PPT for Internal Presentation.
Do not forget to print the poster by Friday, 7 April and send a soft copy to Steven via email before Friday, 7 April 23:59.
Weekend leading to Monday, 10 April: TA testing on SP and IX components, try not to have buggy parts in your web app++.
Tuesday, 11 April: Internal presentation, 8m/group + 2m QnA with presentation order randomised (1-2 speakers/group, using own laptop).
Wednesday, 12 April: 10th STePS finale, test if your idea and product is really accepted by the market out there...
This all important sub-section is final.
The grading of this 41% course project is based on "combination of many factors" computed using a "complex but sophisticated ranking algorithm that resembles how Google Page Rank algorithm works" and adjusted based on feedback from the past 2 AYs. The rationale is that a good website (web application) should rank highly in search engine results (that takes in lots of factors and very hard to game the system...) and a weak website (web application) won't have that many visitors due to low search engine results. The details of this ranking system is shown below. The final ranking day of CS3226 course project is on Wednesday, 12 April 2017, during the 10th STePS. But generally we monitor each group's progress since Week 09-13.
Already finalised but scores are not shown to public:
The list of capstone projects and the scores: