COMP06263 2018 Web Programming 1

General Details

Full Title
Web Programming 1
Transcript Title
Web Programming 1
Code
COMP06263
Attendance
N/A %
Subject Area
COMP - Computing
Department
COEL - Computing & Electronic Eng
Level
06 - NFQ Level 6
Credit
05 - 05 Credits
Duration
Semester
Fee
Start Term
2018 - Full Academic Year 2018-19
End Term
9999 - The End of Time
Author(s)
Colm Davey, Mr. John Kelleher, Shane Banks
Programme Membership
SG_KSMAR_C06 201800 Higher Certificate in Science in Computing in Smart Technologies SG_KSMAR_B07 201800 Bachelor of Science in Computing in Smart Technologies SG_KSODV_C06 201800 Higher Certificate in Science in Software Development SG_KSMAR_H08 201900 Bachelor of Science (Honours) in Computing in Smart Technologies SG_KSODV_H08 201900 Bachelor of Science (Honours) in Computing in Software Development SG_KCMPU_H08 201900 Bachelor of Science (Honours) in Computing SG_KSMAR_C06 201900 Higher Certificate in Science in Computing in Smart Technologies SG_KCMPU_C06 201900 Higher Certificate in Science in Computing in Computing SG_KCMPU_B07 201900 Bachelor of Science in Computing in Computing SG_KSODV_B07 201900 Bachelor of Science in Computing in Software Development
Description

This module will introduce students to modern JavaScript development frameworks. Students will be introduced to the concepts of the frameworks and understand the need to develop web applications using these frameworks. Students will develop responsive web applications that will be cloud hosted and interact with data services.

Learning Outcomes

On completion of this module the learner will/should be able to;

1.

Design and create responsive web pages using modern JavaScript frameworks

2.

Describe the different development tools such as CLI, Git and libraries

3.

Develop operations to interact with data services

4.

Build a web application on a cloud service

Teaching and Learning Strategies

A practical approach to teaching and learning will be used. Problem-based learning will be used where possible. The one hour lecture will be used to introduce core concepts. The lab practicals will be used to understand key concepts by developing web applications. Flipped learning will be employed as required. Screencasting by students of project work will be used to develop presentation skills.

Virtual Machines will be used to allow flexibility and enhance learning.

Module Assessment Strategies

60% continuous assessment. Students have to complete lab work and a number of formative and summative quizzes throughout the module. The summative quizzes will make up 20% of the final mark. These in-class quizzes will be carried out in weeks 4 and 8. Students will complete a project worth 40% and as part of this will be required to peer review and provide feedback to each other. This project will have staged submissions throughout the semester. This project will be aligned with a project students complete in the Cloud Computing module potentially enabling cross-module assessment.

40% end of term practical exam.

Repeat Assessments

Repeat exam to cover all learning outcomes.

Indicative Syllabus

Design and create responsive web pages using modern JavaScript frameworks

  • Examine the different JavaScript frameworks available
  • Introduce many of the framework concepts and coding conventions 
  • Create responsive web pages using libraries and frameworks
  • Use a JavaScript framework to build applications

Describe the different development tools such as CLI, Git, and libraries

  • Evaluate and install an IDE such as VS Code
  • Install NodeJS and become familiar with the command line options
  • Examine Node Package Manager (NPM) and become familiar with installing packages into an application
  • Use GitHub, Git Bash, and the SCM tools in VS Code for code management

Develop operations to interact with data services

  • Examine the concept of APIs, in particular, RESTful APIs
  • Connect to external APIs and import data to the application
  • Examine JSON data structures
  • Build interfaces to correspond to the data structures
  • Build Services that implement the Observable design pattern

Build a web application on a cloud service

  • Examine the different cloud hosting option such as AWS, Azure, GCP, Heroku
  • Build the dist of an application
  • Examine what minified dist code is
  • Determine how to build and push the dist to the hosting platform
  • Ensure external access to the application

Coursework & Assessment Breakdown

Coursework & Continuous Assessment
60 %
End of Semester / Year Formal Exam
40 %

Coursework Assessment

Title Type Form Percent Week Learning Outcomes Assessed
1 Produce a hosted web application Continuous Assessment Project 40 % Week 11 1,2,3,4
2 Multiple Choice Quizzes Continuous Assessment Multiple Choice 20 % OnGoing 1,2,4
             

End of Semester / Year Assessment

Title Type Form Percent Week Learning Outcomes Assessed
1 Lab exam Final Exam Open Book Exam 40 % End of Term 1,3
             
             

Full Time Mode Workload


Type Location Description Hours Frequency Avg Workload
Lecture Computer Laboratory Theory 1 Weekly 1.00
Laboratory Practical Computer Laboratory Progamming 2 Weekly 2.00
Tutorial Computer Laboratory Lab based tutorial 1 Weekly 1.00
Independent Learning UNKNOWN Programming 3 Weekly 3.00
Total Full Time Average Weekly Learner Contact Time 4.00 Hours

Required & Recommended Book List

Recommended Reading
2016-08-26 Learning Bootstrap 4 - Second Edition Packt Publishing

Key Features

  • This book shows how to take advantage of the all new features introduced in Bootstrap
  • Learn responsive web design and discover how to build mobile-ready websites with ease
  • Find out how to extend the capabilities of Bootstrap with a huge range of tools and plugins, including jQuery,
  • Do more with JavaScript and learn how to create an enhanced user experience

Book Description

Bootstrap, the most popular front-end framework built to design elegant, powerful, and responsive interfaces for professional-level web pages has undergone a major overhaul. Bootstrap 4 introduces a wide range of new features that make front-end web design even simpler and exciting.

In this gentle and comprehensive book, we'll teach you everything that you need to know to start building websites with Bootstrap 4 in a practical way. You'll learn about build tools such as Node, Grunt, and many others. You'll also discover the principles of mobile-first design in order to ensure your pages can fit any screen size and meet the responsive requirements. Learn to play with Bootstrap's grid system and base CSS to ensure your designs are robust and that your development process is speedy and efficient. Then, you'll find out how you can extend your current build with some cool JavaScript Plugins, and throw in some Sass to spice things up and customize your themes. This book will make sure you're geared up and ready to build amazingly beautiful and responsive websites in a jiffy.

What you will learn

  • Fire up Bootstrap and set up the required build tools to get started
  • See how and when to use Flexbox with the Bootstrap layouts
  • Find out how to make your websites responsive, keeping in mind Mobile First design
  • Work with content such as tables and figures
  • Play around with the huge variety of components that Bootstrap offers
  • Extend your build using plugins developed from JavaScript
  • Use Sass to customize your existing themes

About the Author

Matt Lambert is a designer and developer with more than 16 years of experience. He currently works full-time as a senior product designer for CA Technologies in Vancouver, BC, Canada.

In his free time, he is an author, artist, and musician. In 2005, Matt founded Cardeo Creative, which is a small web design studio based in Vancouver. He works with a select list of clients on a part-time basis while producing his own products on the side.

To date, Matt has self-published three additional development books titled: Mastering Bootstrap, CSS3 Handbook, and the Freelance Startup Guide. He is also the author of Bootstrap Site Blueprints Volume II, Packt Publishing.

Table of Contents

  1. Introducing Bootstrap 4
  2. Using Bootstrap Build Tools
  3. Jumping into Flexbox
  4. Working with Layouts
  5. Working with Content
  6. Playing with Components
  7. Extending Bootstrap with JavaScript Plugins
  8. Throwing in Some Sass
  9. Migrating from Version 3

Recommended Reading
2015-10-17 Amazon Web Services in Action Manning Publications
ISBN 1617292885 ISBN-13 9781617292880

Summary

Amazon Web Services in Action introduces you to computing, storing, and networking in the AWS cloud. The book will teach you about the most important services on AWS. You will also learn about best practices regarding automation, security, high availability, and scalability.

Purchase of the print book includes a free eBook in PDF, Kindle, and ePub formats from Manning Publications.

About the Technology

Physical data centers require lots of equipment and take time and resources to manage. If you need a data center, but don't want to build your own, Amazon Web Services may be your solution. Whether you're analyzing real-time data, building software as a service, or running an e-commerce site, AWS offers you a reliable cloud-based platform with services that scale. All services are controllable via an API which allows you to automate your infrastructure.

About the Book

Amazon Web Services in Action introduces you to computing, storing, and networking in the AWS cloud. The book will teach you about the most important services on AWS. You will also learn about best practices regarding security, high availability and scalability.You'll start with a broad overview of cloud computing and AWS and learn how to spin-up servers manually and from the command line. You'll learn how to automate your infrastructure by programmatically calling the AWS API to control every part of AWS. You will be introduced to the concept of Infrastructure as Code with the help of AWS CloudFormation.You will learn about different approaches to deploy applications on AWS. You'll also learn how to secure your infrastructure by isolating networks, controlling traffic and managing access to AWS resources. Next, you'll learn options and techniques for storing your data. You will experience how to integrate AWS services into your own applications by the use of SDKs. Finally, this book teaches you how to design for high availability, fault tolerance, and scalability.

What's Inside

  • Overview of cloud concepts and patterns
  • Manage servers on EC2 for cost-effectiveness
  • Infrastructure automation with Infrastructure as Code (AWS CloudFormation)
  • Deploy applications on AWS
  • Store data on AWS: SQL, NoSQL, object storage and block storage
  • Integrate Amazon's pre-built services
  • Architect highly available and fault tolerant systems

About the Reader

Written for developers and DevOps engineers moving distributed applications to the AWS platform.

About the Authors

Andreas Wittig and Michael Wittig are software engineers and consultants focused on AWS and web development.

Table of Contents

    PART 1 GETTING STARTED
  1. What is Amazon Web Services?
  2. A simple example: WordPress in five minutes
  3. PART 2 BUILDING VIRTUAL INFRASTRUCTURE WITH SERVERS AND NETWORKING
  4. Using virtual servers: EC2
  5. Programming your infrastructure: the command line, SDKs, and CloudFormation
  6. Automating deployment: CloudFormation, Elastic Beanstalk, and OpsWorks
  7. Securing your system: IAM, security groups, and VPC
  8. PART 3 STORING DATA IN THE CLOUD
  9. Storing your objects: S3 and Glacier
  10. Storing your data on hard drives: EBS and instance store
  11. Using a relational database service: RDS
  12. Programming for the NoSQL database service: DynamoDB
  13. PART 4 ARCHITECTING ON AWS
  14. Achieving high availability: availability zones, auto-scaling, and CloudWatch
  15. Decoupling your infrastructure: ELB and SQS
  16. Designing for fault-tolerance
  17. Scaling up and down: auto-scaling and CloudWatch

Recommended Reading
2017-09-19 Learning Angular: A Hands-On Guide to Angular 2 and Angular 4 Addison-Wesley Professional

Learning Angular, Second Edition A Hands-On Guide to Angular 2 and Angular 4 Learning Angular teaches modern application development with Angular 2 and Angular 4. It begins with the basics of Angular and the technologies and techniques used throughout the book, such as key features of TypeScript, newer ES6 syntax and concepts, and details about the tools needed to write professional Angular applications.   The reader will next build an Angular application from scratch while learning about the primary pieces of an Angular application and see how they work together. Using lots of examples, the core parts of Angular will be introduced, such as Components, the Router, and Services.   The book also covers techniques like server-side rendering and how to incrementally add Angular 2+ features to existing AngularJS applications. Finally, the reader will gain insight into advanced skills that should be part of any professional Angular developers toolkit such as testing, tooling options, and performance tuning. Understand how Angular is organized and learn best practices for designing Angular applications Quickly build Angular templates with built-in directives that enhance the user experience Bind UI elements to your data model, so changes to your model and UI occur automatically in tandem Define custom Angular directives that extend HTML Implement zoomable images, expandable lists, and other rich UI components Implement client-side services that interact with web servers Build dynamic browser views to provide even richer user interaction Create custom services you can easily reuse Implement rich UI components as custom Angular directives Contents at a Glance Introduction What is Angular Why Use Angular Who this Book is For How to Use this Book Getting the Source Code Chapter 1: Jumping into JavaScript Setting Up a JavaScript Development Environment Defining Variables Understanding JavaScript Data Types Using Operators Implementing Looping Creating Functions Understanding Variable Scope Using JavaScript Objects Manipulating Strings Working with Arrays Adding Error Handling Chapter 2: Jumping into TypeScript Learning the Different Types Understanding Interfaces Implementing Classes Implementing Modules Understanding Functions Chapter 3: Getting Started with Angular Why Angular? Understanding Angular Separation of Responsibilities Adding Angular to Your Environment Using the Angular CLI Creating a Basic Angular Application Chapter 4: Angular Components Component Configuration Building the Template Using Constructors Using External Templates Implementing Directives Chapter 5: Expressions Using Expressions Using Pipes Building a Custom Pipe Chapter 6: Data Binding Understanding Data Binding Interpolation Property Binding Attribute Binding Class Binding Style Binding Event Binding Two-Way Binding Chapter 7: Built-in Directives Understanding Directives Using Built-in Directives Structural Directives Attribute Directives Chapter 8: Custom Directives Creating a Custom Attribute Directive Creating a Custom Directive with a Component Chapter 9: Events and Change Detection Using Browser Events Emitting Custom Events Using Observables Chapter 10: Implementing Angular Services in Web Applications Understanding Angular Services Using the Built in Services Sending HTTP GET and PUT Requests with the http Service Implementing a Simple Mock Server Using the http Service Changing Views with the router Service Implementing a Router with a Navigation Bar Implementing a Router with Parameters Chapter 11: Creating Your Own Custom Angular Service Integrating Custom Services into Angular Applications Implementing a Simple Application That Uses a Constant Data Service Implementing a Data Transform Service Implementing a Variable Data Service Implementing a Service that Returns a Promise Implementing a Shared Service Chapter 12: Having Fun with Angular Implementing an Angular Application That Uses the Animation Service Implementing an Angular Application...

Recommended Reading
2017-04-27 ng-book: The Complete Guide to Angular 4 CreateSpace Independent Publishing Platform
ISBN 1546376232 ISBN-13 9781546376231
Recommended Reading
2018-08-17 Practical Node.js: Building Real-World Scalable Web Apps Apress
ISBN 1484230388 ISBN-13 9781484230381

Module Resources

URL Resources

https://angular.io/

https://getbootstrap.com/

https://material.angular.io/

https://aws.amazon.com/documentation/

https://github.com/

https://nodejs.org/en/

Other Resources

IT Sligo Virtual Machines

Additional Information

None