CSC-PRG7925 - Web Development with JavaScript
Course Description
Ready to bring websites to life? This beginner-friendly course introduces you to the exciting world of web development using HTML, CSS, and JavaScript — the core technologies behind every modern website. You’ll start by mastering the essentials of building and styling web pages, then progress to creating interactive, dynamic user experiences. Along the way, you’ll explore responsive design, ensuring your sites look great on any device, and dive into client-side scripting to make your web projects come alive. By the end of the course, you’ll have the confidence and skills to build fully functional web applications from scratch — opening doors to new and creative career opportunities.
Course Outline
1-3: HTML Fundamentals
- 1: Getting Started with HTML
- Introduction to HTML and its structure
- Creating a basic webpage
- Using semantic HTML5 elements
- Linking pages and navigating within a site
- 2: Working with CSS
- Introduction to CSS and styling web pages
- CSS selectors and properties
- Responsive design principles
- Introduction to CSS frameworks like Bootstrap
- 3: Introduction to JavaScript
- Basics of JavaScript programming
- Variables, data types, and operators
- Control structures: conditionals and loops
- Functions and event-handling in JavaScript
4-6: Advanced HTML and CSS
- 4: HTML Forms and Media
- Creating forms and form validation
- Embedding multimedia: images, audio, and video
- Accessibility considerations in HTML and media elements
- 5: Advanced CSS Techniques
- CSS layout techniques: Flexbox and Grid
- CSS animations and transitions
- CSS preprocessors (e.g., Sass) introduction
- 6: Responsive Web Design
- Media queries and responsive layouts
- Designing for mobile-first and adaptive layouts
- Testing and debugging responsive designs
7-9: Intermediate JavaScript
- 7: DOM Manipulation
- Manipulating the Document Object Model (DOM)
- Event delegation and handling user interactions
- Introduction to AJAX and Fetch API
- 8: JavaScript Functions and Objects
- Advanced JavaScript functions
- Working with objects and arrays
- Using JSON for data exchange
- 9: Asynchronous JavaScript
- Introduction to asynchronous programming
- Promises and async/await syntax
- Handling errors and timeouts in asynchronous code
10-12: Project and Deployment
- 10: Single Page Applications (SPA)
- Building a simple SPA with JavaScript frameworks/libraries (e.g., React, Vue)
- State management in SPAs
- 11: Version Control and Deployment
- Introduction to Git and GitHub
- Deploying a website using GitHub Pages or other hosting platforms
- Best practices for web development workflow
- 12: Final Project
- Capstone project: Design and develop a responsive web application using HTML, CSS, and JavaScript
- Presentation of final projects and peer feedback
Learner Outcomes
This structured approach ensures that you progressively build your skills in web development, from foundational HTML and CSS to dynamic client-side scripting with JavaScript, culminating in the development and deployment of your web applications. By the end of this course, students should be able to:
- Create and structure web pages using HTML5 that adhere to best practices and accessibility standards.
- Style web pages using CSS3, including responsive design techniques and CSS frameworks.
- Implement client-side interactivity using JavaScript, including DOM manipulation and event handling.
- Develop responsive and mobile-first web designs using media queries and flexible layout techniques.
- Utilize JavaScript libraries and frameworks to enhance web development productivity.
- Understand asynchronous programming and manage asynchronous operations using promises and async/await.
- Design and implement single-page applications (SPAs) using modern JavaScript frameworks.
- Use version control systems like Git for collaborative web development and deploy web applications using cloud platforms.
- Apply debugging techniques to troubleshoot and resolve issues in web applications.
- Demonstrate proficiency in designing and developing a complete web application as a capstone project.
Notes
Target Population:
This class is for individuals who are new to programming and eager to embark on a career in web development. This course is ideal for students enrolled in computer science or related fields at the introductory level, providing them with essential skills to complement their academic studies. Beginners with a foundational understanding of HTML and CSS, acquired through introductory courses or self-study, will find this JavaScript course instrumental in advancing their capabilities in creating interactive and dynamic web pages.
Moreover, career changers looking to transition into the tech industry, particularly those with a background in graphic design, IT support, or other non-programming disciplines, can benefit significantly from this course. It offers a structured pathway to acquire fundamental programming skills with JavaScript, enabling them to build a strong foundation in web development. Additionally, enthusiasts and self-learners passionate about technology and eager to explore programming for the first time will find the course accessible and rewarding, providing them with the necessary skills to start creating their own web applications and websites.
Occupational Outlook:
According to the Department of Labor, employment of web developers is projected to grow 13 percent from 2018 to 2028, much faster than the average for all occupations.
Central Piedmont Community College Continuing Ed Certificate:
A certificate of completion for the class will be issued to participants with at least 80% attendance, class participation, and completion of hands-on practice and projects.
Industry Certification:
Unlike some other fields like cybersecurity or project management, Web Development and JavaScript certification programs are not as prevalent or standardized. Instead of relying solely on certifications, employers often focus on a candidate's practical skills, experience, and ability to showcase their projects or contributions to open-source initiatives. Building a strong portfolio and demonstrating your expertise through real-world projects is often more valuable in the field of web development and JavaScript.
Method of Instruction:
Blended learning with lectures, videos, class discussions, live demonstrations, hands-on exercises, and projects. Outside homework is assigned.
Evaluation:
Participation and completion of all skill lab practices are expected. Class attendance is required for successful completion.
- Class participation and attendance (50%)
- Projects/Competencies/Research (50%)
Prerequisites
Materials: This class does not include course materials. Students are required to purchase the necessary materials directly from the bookstore or our designated partner. Details will be provided the first day of class.
Resources:
- Participants are required to have a laptop or desktop computer with a minimum 4GB ram, 256GB HD, Core i5. Recommended 8GB ram, 256GB SSD, Core i5.
- You must be able to download programming resources to your laptop/desktop for this class.
- Access to reliable internet as well as a camera, a headset, and preferably dual monitors.
Prerequisite and desired knowledge:
To ensure a smooth start in learning programming, here are the most foundational skills and knowledge areas that learners should have:
1. Basic Computer Literacy
- Operating Systems: Ability to navigate and use a common operating system (e.g., Windows, macOS, or Linux).
- File Management: Understanding how to create, organize, and manage files and folders.
- Software Installation: Capability to install and configure basic software applications.
2. Basic Typing Skills
- Basic proficiency in typing,
3. Familiarity with Internet and Web Browsing
- Web Browsers: Understanding how to use a web browser to navigate the internet.
- Search Engines: Ability to use search engines to find information effectively.
4. Problem-Solving
- Critical Thinking: Basic skills in analyzing problems and thinking critically about potential solutions.
Recommendations
IMPORTANT: Make sure to have your network login, Microsoft authenticator, and student email before the first day of class.