Welcome to the website for CITS3403 Agile Web Development. The Internet is continuing to grow, with a shift from the knowledge provision that typified the Web of the early 2000's, to highly interactive sites and user generated content. This has led not only to some remarkable business opportunities but also to profound changes in the way people relate to each other. This unit explores technologies, programming languages and environments that underpin development for the modern Internet. It builds on students' previous programming experience to develop and demonstrate technologies in action.
CITS3403/5505 Agile Web Development will cover the foundations of the web and internet, fundamental browser techbnologies including HTML, CSS and javascript, the development process for large applications, and full-stack web development using Flask, AJAX and SQLite.
This unit will share material between CITS5505 and CITS3401, although there will be some differences in assessment and class. The handbook entry and general unit policies are all available from the online LMS and we will use MSTeams (CITS3403 and CITS5505) for discussion and class management.
Each student should attend (or view) the two hour lecture, complete a two hour lab and attend or view the workshop every week. Attendance will not be taken. Online labs will be conducted via MSTeams.
Type | Time | Day | Location |
---|---|---|---|
Combined Lecture | 2:00 - 4:00 pm | Wednesday | Wilsmore Lecture Theatre |
Combined Workshop | 9:00-10:00am | Friday | Murdoch Lecture Theatre |
CITS5505 Lab | 2:00-4:00pm | Monday | MCL net C Face to Face |
CITS3403 Lab | 10:00-12:00pm | Tuesday | MCL net B Face to Face |
CITS3403 Lab | 10:00-12:00pm | Tuesday | Microsoft Teams |
CITS5505 Lab | 10:00-12:00pm | Tuesday | Microsoft Teams |
CITS3403 Lab | 12:00-2:00pm | Tuesday | MCL net B Face to Face |
CIT3403 Lab | 2:00-4:00pm | Tuesday | Microsoft Teams |
CITS3403 Lab | 11:00-1:00pm | Wednesday | Microsoft Teams |
CIT3403 Lab | 4:00-6:00pm | Wednesday | CSSE Lab 2.03 Face to Face and Teams |
Lab cancelled | |||
CIT3403 Lab | 10:00-12:00pm | Thursday | CSSE Lab 2.03 |
CITS3403 Lab | 2:00-4:00pm | Thursday | MCL net D |
CIT3403 Lab | 4:00-6:00pm | Thursday | MCL net D |
CIT5505 Lab | 10:00-12:00pm | Friday | MCL net D |
Consultation | 10:00-12:00pm | Wednesday | CSSE Rm 2.14 and MS Teams |
The assessment for CITS3403 consists of a mid-semester test, a group project and an examination.
The assessment for CITS5505 consists of an individual project, a group project and an examination.
Assessment | % of Final Mark | Due Date |
---|---|---|
CITS3403 Mid-semester Test | 20 | 08-04-2022 |
CITS5505 Individual Project | 20 | 14-04-2022 |
Group Project | 30 | 23-05-2022 |
Final Exam/Take Home Test | 50 | 31-05-2022 |
PDF files of the individual lectures will be made available from here as the semester progresses, as well as the files used for demonstrations. Lecture recordings are also available via LMS
The Lab Exercises will be available on Fridays of the week before the scheduled lab.
Week | Date | Lecture (Wed Wilsmore, 2-3pm) | Lecture (Wed Wilsmore 3-4pm) | Lab Various | Workshop (Murdoch Fri 9am) |
---|---|---|---|---|---|
1 | Feb 28 | Introduction | HTML | No lab, but set up your Dev Environment | Visual Studio Code. |
2 | Mar 7 | CSS | Bootstrap | Getting Started, and HTML5 | CSS & Bootstrap |
3 | Mar 14 | Javascript | Javascript |
CSS and Bootstrap | Javascript |
4 | Mar 21 | Document Object Model | Document Object Model | Javascript | Document Object Model |
5 | Mar 28 | JQuery | AJAX | Document Object Model | Midsemester Test Revision |
6 | Apr 4 | Agile Development | GIT | AJAX | Midsemester Test |
7 | Apr 11 | Flask Web Development |
Server Side Rendering | Git Basics | Good Friday 5505 project due |
Non Teaching Study Break | |||||
8 | Apr 25 | MVC Architecture |
Object Relational Model | First Flask App | Setting up Flask |
9 | May 2 | REST APIs | REST APIs | Adding a Database | Adding a DB |
10 | May 9 | Authentication | Testing | Testing | Testing |
11 | May 16 | Client Side Rendering | Sockets | Deploying to Heroku | SPAs |
12 | May 123 Project due |
Going to Production | Future of the web | Project demos | Revision |
Due 5pm, April 14, 2022
This project is worth 20% of your final grade and must be done individually. It is for CITS5505 students only.
The project description, instructions and marking scheme is available here.
Due 12noon, May 23, 2022
This project is worth 30% of your final grade in the unit must be done in groups of two to four for CITS3403 students. For CITS5505 students, it should be done in pairs, and both students must be CITS5505, unless special permission has been granted.
A Marking Criterion is now available
For this project you are required to build an online daily puzzle, operating in a similar manner to Wordle. The app should have a short daily exercise that users do; the users recieve a score, or a rank, or some kind of feedback; they can share their performance with others through social media or similar mechanisms; and they can track their progress and statistics. It should also be convenient and easy to play via mobile devices, and engaging enough for the users to want to return regularly. The application should be written using HTML, CSS, Flask, AJAX, JQuery, and Bootstrap. (Any additional technologies not mentioned in lectures will require special approval from the unit coordinator).
It is not expected that you produce an exact Wordle clone, and this approach will not recieve high marks. Any daily puzzle or challenge is good: guess the secret sound, number games, sudoko like puzzles, programming challenges, hotter/colder games. You are encouraged to link it to things your are interested in: the puzzle could be to identify a sports person from their statistics, or a common supermarket product from its carbon footprint.
There are a number of Wordle clones already available:Think carefully about the design of the application. It should be:
The web application should be styled to be interesting and engaging for a user in the selected context. It should offer several views including:
In addition to the web application, you should create a private GitHub project that includes a readme describing:
Group Registration is via this application, which also include a feature for requesting to be assigned to a group and booking demonstration times in week 12..
Find a partner(s) with (ideally with common interests) and come up with a theme for your application. Discuss styling, how the application is likely to be used, and precisely what functaionality it should offer.
The second part of the project criteria is the back end functionality of web application. The web application should be implmented using Flask (any additional libraries/modules require unit coordinator approval), and provide at least the following functionality:
Marking Scheme
The Marking Criterion is available.
Students should submit a complete Flask application providing the functionality of the project. This should be submitted as a zip including
git log -–all -–decorate -–graph
to format the log
(you may need to change some of the options, but make sure that all authors and commits on all branches are visible). pip freeze > requirements.txt
while your virtual environment is active.
Submit your zipped file to cssubmit, making sure that you submit it to the correct unit code, as CITS3403 and CITS5505 have the same name.
Demonstration ScheduleIn week 12 all members of each team must present and demonstrate their project. The schedule is available at the sign up page. There will be a link for your teams meeting to do the demonstration. Please:
The Midterm test will be held in week 6 and is worth 20% of your final grade. It is for CITS3403 students only.
Past midterm tests are available for practice. Particularly, via LMS you can access last years mid-semester test, and a sample mid-semester test for practice. The mid-semester test this year will be similar except: it is worth 20% rather than 10%; you will have 1 hour rather than 30 minutes; and there will be 5 multiple choice questions rather than 3. Other written exams you can use for practice are below.
The following three references have been used previously in mid-semester tests, and maybe useful to include in your open book material. They will also be provided with the final exam, so it is worth getting familiar with the format of each reference.
The test will be available on LMS, and all students must commence the test between 8.30am and 9.30am on Friday, April 8, unless special permission has been granted to complete the test at a different time.
The test will be open book. Students may have any printed materials with them during the test, or have electronic documents open prior to the test. Students may not use internet search, IDEs or any other electronic aids in the test. All typing must be in the LMS test window.
Students may not communicate with one another or receive any external help during the test.
If students lose internet connection or power during the test, they should attempt to restart the test as soon as possible (progress is autosaved), and send the unit-coordinator a note to explain what happenned at the end of the test.
The test will consist of 5 multiple choice questions (1 mark each), 1 short essay question (3 marks), and 1 coding question (4 marks, and accurate syntax is not required). Questions will be randomised, but will all have similar levels of difficulty. Students will have 60 minutes to complete all questions.
The questions will be on material from the lectures and labs in the first four weeks (including any readings specified in the labs). You could be asked for example to define concepts, explain the rationale behind them or the history of how they came about, discuss the issues involved or the decisions made and provide advantages and disadvantages of alternatives. You could also be asked to write some code.
Your answers do not need to use lengthy prose. You may use bullet points when relevant.
Released 8am, Tuesday May 31, 2022, Due 5pm, Wednesday June 1, 2022 Now available here
This Exam is worth 50% of your final grade and must be done individually. For equity reasons, the teaching staff will not be able to answer individual questions between the exams release and the due date. Questions may be posted to a public teams channel and may be answered by teaching staff. Any communication, commentary, or discussion of the test during this period will be considered academic misconduct.
The test should take about 3 hours to complete, and will involve producing a web site addressing a given specification. You will be required to write the web-site (including HTML, JS, CSS and multi-media files) and submit these files as a zip to cssubmit.
A sample exam will be made available in week 11, and further details of the examination topics and structure will be discussed during Week 13's review lecture.
Build a study web site for the unit Agile Web Development, with the following specification:
There are a number of excellent online resources and textbooks for the subjects covered in this unit. For the lectures and lab exercises, we may refer to the books:
Note that here are sufficient resources for your study available online. These include:
Data Science with Daniel is a great resource for web and data science technologies, promoted and run by a former student of the unit!
Tom's github and Tim's github.
Lauren's awesome getting started with Flask and VSCode notes.
Feel free to suggest additional resources you have found useful.