Web Essential – Basic

Web Core

Course Overview

Learning the basic knowledge required for web development

You will learn basic web standard technologies that you need to know to become a web developer or web designer, and you will create a real homepage through individual projects.

This course covers the following topics:

HTML Basic structure of an HTML document, elements and tags, attributes and their uses, HTML5 semantic elements and their uses creating forms and input types.
CSS Selectors and cascading, box model, layout, responsive design with media queries, CSS frameworks like Bootstrap
JavaScript Basic syntax, variables, data types, control structures, functions, DOM manipulation, jQuery, and other JavaScript libraries
Photoshop Introduction, basic features, web image optimization.
WordPress Installing and setting up WordPress, creating pages and posts, customizing themes and templates, working with widgets and plugins, creating custom post types and taxonomies, building custom themes and plugins, using the WordPress REST API

This course aims to provide students with the skills and knowledge necessary to build and maintain websites using commonly used technologies.

Course Objectivies

  • The overall goal of this course is to prepare students to be proficient in building and maintaining websites and to apply these skills to real-world projects

  • Learn basic concepts about the web

  • Acquiring the basic skills needed to create a website

  • Acquiring basic web design skills necessary for website creation

  • Acquiring the entire process of actual homepage production

  • Design and develop static web pages using HTML, CSS, and JavaScript

  • Implementation of mobile-friendly website using responsive design technology

  • Implementing interactive, dynamic web pages using JavaScript

  • Understanding CMS (Content Management System) and building a dynamic website using WordPress

  • Extend the look and functionality of your WordPress website with themes and plugins

  • Integrating useful services into your WordPress website

Course Output

  • Personal home page

  • Acquire basic knowledge of IT and understand basic essential web technologies.

Details

  • Course Type : web core

  • Program : Regular course

  • Duration : 1 month

  • Class Hours : 8 hours a day – IT(4hours) + English(4hours)

  • Open Schedule : First Monday of each month

  • Class Schedule : Monday ~ Friday(AM8:00 ~ PM5:00)

  • Target : Students who are new to IT, students who are new to web technology

  • Required IT level : Lower

  • Level after completion : Ability to easily create your own website

  • Career Paths : Web publisher, web agency freelancer

  • Requirements : Laptop

Skills you will learn

Course Introduction

  • Welcome to Module 1: Introduction to HTML
  • Setup, Tools what we need.
  • What is HTML?
  • Relevant History of HTML
  • Anatomy of an HTML Tag
  • Basic HTML Document Structure
  • HTML Content Models
  • Heading Elements
  • HTML Content Models
  • Heading Elements
  • Lists
  • HTML Character Entity References
  • Creating Links
  • Displaying Images
  • Project
  • Welcome to Module 2: Introduction to CSS
  • Power of CSS
  • Anatomy of a CSS Rule
  • Element, Class, and ID Selectors
  • Combining Selectors
  • Pseudo-Class Selectors
  • Style Placement
  • Conflict Resolution
  • Styling Text
  • The Box Model
  • The background Property
  • Positioning Elements by Floating
  • Relative and Absolute Element Positioning
  • Media Queries
  • Project

Practical and Project

  • Practicum of what they have learned?

  • Welcome to Module 3: Introduction to JavaScript
  • Adjusting Development Environment for JavaScript Development
  • Where to Place JavaScript Code?
  • JavaScript Types
  • Common Language Constructs
  • Handling Default Values
  • Creating Objects Using ‘new Object()’ Syntax
  • Creating Objects Using Object Literal Syntax
  • Project
  • Functions Explained
  • Passing Variables by Value vs. by Reference
  • Function Constructors, prototype, and the ‘this’ Keyword
  • Arrays
  • Closures
  • Fake Namespaces
  • Immediately Invoked Function Expressions (IIFEs)
  • Project

Practical and Project

  • Practicum of what they have learned?

  • Welcome to Module 4: Introduction to WordPress
  • What is WordPress?
  • Setup Xampp
  • Install WordPress
  • WordPress Theme
  • WordPress Plugins
  • Photoshop
    • 1. Feature introduction
    • 2. Install Photoshop
    • 3. How to create images for web pages
  • Create a WordPress Website
    • Theme Style
    • Edit Your Website
    • Edit Text
    • Edit Button
  • Practical WordPress
    • Practicum of what they have learned?
    • Copyright Free Images
    • Change Text Color
    • Change Button Colors
    • Change Button Roundness
    • Background Overlay
    • Undo Changes
    • Rearrange Sections
    • Delete Sections
    • Move Columns
    • Delete Columns
    • Spacing
    • Section Spacing
    • Margin & Padding Spacing
    • Deleting Elements
    • Update Website
    • Add a Background
    • Download Correct Image Size
    • Upload Image
    • Add Spacing To Background
    • Resize Background
    • Add Text
  • Practical and Project
    • Practicum of what they have learned?
    • Make Background Fixed Effect
    • Preview Changes
    • Rearrange a Section
    • Add Regular Text
    • Change Text Color
    • Create a divider line
    • Create Multiple Columns
    • Add Text

  • Revisions
  • Mobile Friendly
  • Resize Text For Mobile Device
  • Change Mobile Background Position
  • Mobile Background Width
  • Edit About Page
  • Blocks
  • Services Page
  • Import Entire Page
  • Copy a Section
  • Create a Template
  • Transparent Header
  • Add Page To Menu
  • Sub Menu
  • Delete Page From Menu
  • Create a Simple Text Logo
  • Upload Your Logo
  • Create Your Own Logo
  • Create Site Icon
  • Header
  • Rearranging Header
  • Header Button
  • Change Menu Color
  • Mobile Header
  • Mobile Menu Design
  • Mobile Menu Button
  • Tablet Logo Size
  • Footer
  • Logout
  • Finalized your WordPress Website
  • Practical and Project
    • Practicum of what they have learned?

Recommended Course

Web Development – Pro

Learning various languages and knowledge for backend development.

Based on web standard technology, the curriculum is structured in the form of TASK & PROJECT, focusing on nurturing web application developers, progressing step by step from the basics, and enabling smooth learning of basic and applied learning.

Upon completion of the entire course, you will have the skills of a developer that can be put into project.

Web Design

Learning the fundamental knowledge for web design.

The curriculum is designed to enable web designers to learn the knowledge necessary for creating mock-up designs, working with design elements, publishing, and even interactions.

Daily Schedule

Morning Class Lunch Afternoon Class Dinner Evening Class
8:00-12:05 12:05-13:05 13:05-17:00 17:00-18:00 18:00-22:00
English 1:1, Group class IT class Project & Homework(Self-Learning)