IT371 | Web Technologies
- Rating: 4.85
- (439)
Course overview
This course covers the basics of modern full stack web development, from UX design to front-end coding to custom databases. Students will build foundational skills in a full range of technologies, including HTML/CSS, Javascript, and MongoDB, and will learn to implement a reactive, multi-user web application using the meteor.js framework.
What you will learn
-
CLO-1 Discuss how web standards impact software development. (C2 - Understanding).
-
CLO-2 Describe the constraints that the web puts on developers. (C3 - Applying).
-
CLO-3 Design and Implement a simple web application. (C6 - Creating).
-
CLO-4 Review an existing web application against a current web standard. (C5 - Evaluating).
- Building a Web
- HTML, CSS, Adding Images, Color, Fonts, Links, Control
- JavaScript
- Variables, Methods, Functions, Loop, Input and Events
- Front-End Web UI
- Web UI Frameworks, Bootstrap, Full Stack, Responsive Grid
- Git and Node
- Setting up Git, Basic Git Commands, Node.js and NPM
- Bootstrap CSS
- Navigation, Buttons, Forms, Tables, Cards, Images and Media, Badges, Alerts, Progress Bars
- Bootstrap JavaScript
- Tabs, Pills, Hide and Seek, Collapse and Accordion, Tooltips, Popovers and Modals, Carousel
- Bootstrap JQuery
- Web Tools, Less and Sass, NPM Scripts
- React
- React Components, JSX, Router, SPA, Redux
Course program
Students will add several projects to their portfolio to demonstrate their skill and growth throughout this course. They will create web pages using basic elements to control layout and style, use responsive web design principles to take a site from wireframe to website, implement security features, and create collaborative multi-user experiences. Just like any professional full stack web developer, they will build accessibility and usability into responsive websites.Lessons | Name | Description | Duration | Week | Slides |
---|---|---|---|---|---|
1 | Building Web with HTML | HTML5, Tags, Images, Links, Lists, Tables | 3 hours | 1 | WTF2001 |
2 | Styling Web with CSS | CSS 3.0, Classes, IDs, Color, Hex Code | 3 hours | 2 | WTF2002 |
3 | JavaScript Programing | Variables, Methods, Functions, Types | 1 hours | 3 | WTF2003 |
4 | Event Driven Programming | Buttons with DIVs, HTML 5 Canvas, Inputs and Events | 2 hours | 3 | WTF2004 |
5 | File Upload & Display Images | Libraries, Files, Images, Filters, Green Screen | 3 hours | 4 | WTF2005 |
6 | Full Stack Web Development | Introduction, Front and Back End, UI Frameworks | 1 hours | 5 | WTF2006 |
7 | Setting Up Git Environment | Basic Git Command, Online Git Repositories, Node.js and NPM | 2 hours | 5 | WTF2007 |
8 | Introduction to Bootstarp | Download and Setup UI Framework - Bootstrap | 1 hours | 6 | WTF2008 |
9 | Bootstrap Grid System | CSS Flexbox, Push and Pull, Alignment, Offset, Nesting | 2 hours | 6 | WTF2009 |
10 | Bootstrap CSS Components | Navigation and Navigation Bars, Breadcrumbs, Font Awesome, Social | 3 hours | 7 | WTF2010 |
11 | Bootstrap CSS Components | User Inputs, Button and Forms, Checkbox and Select | 1 hours | 8 | WTF2011 |
12 | Bootstrap CSS Components | Tables and Cards, Displaying Content | 2 hours | 8 | WTF2012 |
13 | Bootstrap CSS Components | Images and Media, Responsive Embedd | 1 hours | 9 | WTF2013 |
14 | Bootstrap CSS Components | Alerts, Badges, Progress Bars | 2 hours | 9 | WTF2014 |
15 | Bootstrap JavaScript Components | Tabs, Pills and Tabbed Navigation | 1 hours | 10 | WTF2015 |
16 | Bootstrap JavaScript Components | Collapse and Accordion | 2 hours | 10 | WTF2016 |
17 | Bootstrap JavaScript Components | Tooltips, Popovers and Modals | 1 hours | 11 | WTF2017 |
18 | Bootstrap JavaScript Components | Carousal | 2 hours | 11 | WTF2018 |
19 | Bootstrap and jQuery | Selectors, Events, Carousal Control Buttons | 3 hours | 12 | WTF2019 |
20 | CSS Preprocessors | Less and Sass, Variables, Nesting, Mixins | 3 hours | 13 | WTF2020 |
21 | NPM Scripts | Building and Deployment | 3 hours | 14 | WTF2021 |
22 | Task Runners | Grunt and Gulp | 3 hours | 15 | WTF2022 |