Web Design - J Cloud Work

HTML DOM

The Document Object Model (DOM) is a programming interface for HTML and XML documents. It represents the page so that programs can change the document structure, style, and content. The DOM represents the document as nodes and objects. That way, programming languages can connect to the page.

Benefits

Data persists in memory.
You can go forwards and backwards in the tree (random access)
You can make changes directly to the tree in memory.

Module 1

Content	Description	No. of sessions
HTML Tutorial	HTML Introduction	1
	HTML Editors	1
	HTML Basic	1
	HTML Elements	1
	HTML Attributes	1
	HTML Headings	1
	HTML Paragraphs	1
	HTML Styles	1
	HTML Formatting	1
	HTML Quotations	1
	HTML Comments	1
	HTML Colors	1
	HTML CSS	1
	HTML Links	1
	HTML Images	1
	HTML Tables	1
	HTML Lists	1
	HTML Block & Inline	1
	HTML Classes	1
	HTML Id	1
	HTML Iframes	1
	HTML Head	1
	HTML Layout	1
	HTML Semantics	1
	HTML Style Guide	1
	HTML Entities	1
	HTML Symbols	1
	HTML Emojis	1
	HTML Charset	1
	HTML URL Encode	1
	HTML vs. XHTML	1
	HTML Graphics	1

Module 2

Content	Description	No. of sessions
HTML Forms	HTML Form Attributes	1
	HTML Form Elements	1
	HTML Input Types	1
	HTML Input Attributes	1
	HTML Input Form Attributes	1

Module 3

Content	Description	No. of sessions
HTML Media	HTML Media	1
	HTML Video	1
	HTML Audio	1
	HTML Plug-ins	1
	HTML YouTube	1

Module 4

Content	Description			No. of sessions
HTML APIs	HTML Geolocation			1
	HTML Drag/Drop			1

CSS (Grid , Flex)

Grid Layout gives us a method of creating grid structures that are described in CSS and not in HTML. It helps us to create layouts that can be redefined using Media Queries and adapt to different contexts. Grid Layout lets us properly separate the order of elements in the source from their visual presentation. A flex container expands items to fill available free space or shrinks them to prevent overflow. Most importantly, the flexbox layout is direction-agnostic as opposed to the regular layouts (block which is vertically-based and inline which is horizontally-based).

Benefits

CSS Grids helps you create the outer layout of the webpage.
Flexbox mostly helps align content & move blocks.
CSS grids are for 2D layouts.
Flexbox works better in one dimension only (either rows OR columns).
It will be more time saving and helpful if you use both at the same time.

Module 1

Content	Description	No. of sessions
CSS Tutorial	CSS Introduction	1
	CSS Syntax	1
	CSS Selectors	1
	How To Add CSS	1
	CSS Comments	1
	CSS Colors	1
	CSS Backgrounds	1
	CSS Borders	1
	CSS Margins	1
	CSS Padding	1
	CSS Height/Width	1
	CSS Box Model	1
	CSS Outline	1
	CSS Text	1
	CSS Fonts	1
	CSS Icons	1
	CSS Links	1
	CSS Lists	1
	CSS Tables	1
	CSS Display	1
	CSS Max-width	1
	CSS Position	1
	CSS Overflow	1
	CSS Float	1
	CSS Inline-block	1
	CSS Align	1
	CSS Combinators	1
	CSS Opacity	1
	CSS Navigation Bar	1
	CSS Dropdowns	1
	CSS Image Gallery	1
	CSS Image Sprites	1
	CSS Forms	1
	CSS Counters	1
	CSS Website Layout	1

Module 2

Content	Description	No. of sessions
CSS Advanced	CSS Rounded Corners	1
	CSS Backgrounds	1
	CSS Colors	1
	CSS Color Keywords	1
	CSS Gradients	1
	CSS Shadows	1
	CSS Text Effects	1
	CSS Web Fonts	1
	CSS 2D Transforms	1
	CSS 3D Transforms	1
	CSS Transitions	1
	CSS Animations	1
	CSS Tooltips	1
	CSS Style Images	1
	CSS Image Reflection	1
	CSS object-fit	1
	CSS object-position	1
	CSS Buttons	1
	CSS Pagination	1
	CSS Multiple Columns	1
	CSS User Interface	1
	CSS Variables	1
	CSS Box Sizing	1
	CSS Media Queries	1

Module 3

Content	Description	No. of sessions
CSS Grid	Grid Intro	1
	Grid Container	1
	Grid Item	1

WordPress

WordPress is web publishing software you can use to create a beautiful website or blog. It just may be the easiest and most flexible blogging and website content management system (CMS) for beginners.

Benefits

Easy To Install. To get started with WordPress is a breeze as it has a simple and quick process of installation. …
Easy To Use. The most vibrant feature of WordPress is its ease. …
Responsive Design. …
Media Management. …
Multiple Theme Options. …
Plugins for Customization. …
Flexibility. …
WooCommerce for E-commerce.

Module 1

Content	Description	No. of sessions
WordPress	Choosing your CMS	1
	Types of WordPress	1
	Setting up local server	1
	Downloading XAMPP	1
	Installing XAMPP to create local server	1
	Creating database and Downloading WordPress	1
	Installing WordPress	1
	Custom installation	1
	Logging in to WordPress	1

Module 2

Content	Description	No. of sessions
The WordPress dashboard	Screen options	1
	Customizing your dashboard	1
	Editing your profile	1
	Logging out	1
	Must have WordPress plugins	1
	Updating plugins, and themes	1

Module 3

Content	Description	No. of sessions
Posts in WordPress	Difference between posts and pages	1
	Creating a new post	1
	Visual and HTML editor	1
	Adding media	1
	Inserting a gallery	1
	Full screen editing	1
	Autosave	1
	Categories and tags	1
	Using custom fields	1
	Previewing, publishing, and saving	1
	Editing an existing post	1
	Quick edit	1
	Deleting and viewing a post	1
	Changing post status and visibility	1
	Permalinks and short links	1

Module 4

Content	Description	No. of sessions
Media in WordPress	The library	1
	Scaling and cropping images	1
	Media metadata	1
	Uploading media	1

Module 5

Content	Description			No. of sessions
Adding Links in WordPress	Adding links			1
	Link categories			1

Module 6

Content	Description	No. of sessions
Pages in WordPress	Adding, editing, and deleting pages	1
	Page attributes	1
	Parent pages	1
	Templates	1
	Ordering pages	1

Module 7

Content	Description	No. of sessions
Comments	Enabling and disabling comments	1
	Setting default behaviors for comments	1
	Viewing comment	1
	Comment approval process	1
	Dealing with spam	1
	Deleting comments	1

Module 8

Content	Description	No. of sessions
Appearance	Installing and managing themes	1
	Widgets	1
	Menus	1
	Appearance Editor	1
	Editing the CSS files	1

Module 9

Content	Description	No. of sessions
WordPress Plugins	What are plugins?	1
	Finding plugins	1
	Installing plugins	1
	Activating and deactivating plugins	1
	Editing plugin settings	1
	Deleting plugins	1

Module 10

Content	Description			No. of sessions
WordPress Users	Adding, editing, and deleting users			1
	User roles and permissions			1

Module 11

Content	Description			No. of sessions
WordPress tools	Importing content from another site			1
	Exporting your WordPress data			1

Module 12

Content	Description	No. of sessions
WordPress Settings	General settings	1
	Changing the site title and tagline	1
	Changing your URL	1
	Using a different homepage	1
	Updating the admin email address	1
	Changing time zones	1
	Date/Time formats	1

Module 13

Content	Description	No. of sessions
Writing settings	Changing the post box size	1
	Changing default post and links	1
	Post to your site via email	1
	Remote publishing	1

Module 14

Content	Description			No. of sessions
Reading settings	Changing default page behaviors			1

Module 15

Content	Description			No. of sessions
Discussion settings	Default article and comment settings			1
	Comment moderation settings			1

Module 16

Content	Description	No. of sessions
Media settings	Image sizing	1
	Embedding media	1
	Changing the default folder for uploaded files	1

Module 17

Content	Description			No. of sessions
Privacy settings	Permalink settings			1
	Photo Album configuration			1

Module 18

Content	Description	No. of sessions
WordPress theme overview	Anatomy of a theme	1
	Theme stylesheets	1
	Functions file	1
	Referencing files from a template	1
	Overview of WordPress theme customization	1

Module 19

Content	Description	No. of sessions
Domain	What is Domain?	1
	Choosing the right domain name	1
	Registering your domain	1
	Choosing your hosting services	1
	Comparing various service providers	1
	Choosing your hosting provider	1
	Pointing your domain to hosting provider	1
	Setting up your Web server	1
	Installing your WordPress to your Web server	1
	Installing your WordPress to your Web server	1

PHP (Back end , Front end)

PHP is a back end development language only. PHP belongs to the LAMP stack, which stands for Linux, Apache, MySQL, and PHP/Perl/Python. To develop a web app with this technology stack, a software engineer needs to know four different syntax systems, as well as HTML and CSS.

Benefits

Open Source. PHP (Hypertext Preprocessor) is an open source programming language it is implemented on the server side. …
Easy To Develop. …
Ease Manageable. …
Cost Effective. …
Database Flexibility.

Module 1

Content	Description	No. of sessions
PHP Tutorial	PHP HOME	1
	PHP Intro	1
	PHP Install	1
	PHP Syntax	1
	PHP Comments	1
	PHP Variables	1
	PHP Echo / Print	1
	PHP Data Types	1
	PHP Strings	1
	PHP Numbers	1
	PHP Math	1
	PHP Constants	1
	PHP Operators	1
	PHP If...Else...Elseif	1
	PHP Switch	1
	PHP Loops	1
	PHP Functions	1
	PHP Arrays	1

Module 2

Content	Description	No. of sessions
PHP Forms	PHP Form Handling	1
	PHP Form Validation	1
	PHP Form Required	1
	PHP Form URL/E-mail	1
	PHP Form Complete	1

Module 3

Content	Description	No. of sessions
PHP Advanced	PHP Date and Time	1
	PHP Include	1
	PHP File Handling	1
	PHP File Open/Read	1
	PHP File Create/Write	1
	PHP File Upload	1
	PHP Cookies	1
	PHP Sessions	1
	PHP Filters	1

Module 4

Content	Description	No. of sessions
PHP OOP	PHP What is OOP	1
	PHP Classes/Objects	1
	PHP Constructor	1
	PHP Destructor	1
	PHP Access Modifiers	1
	PHP Inheritance	1
	PHP Constants	1
	PHP Abstract Classes	1
	PHP Interfaces	1
	PHP Static Methods	1
	PHP Static Properties	1
	PHP Namespaces	1
	PHP Iterables	1

Module 5

Content	Description	No. of sessions
MySQL Database	MySQL Database	1
	MySQL Connect	1
	MySQL Create DB	1
	MySQL Create Table	1
	MySQL Insert Data	1
	MySQL Select Data	1
	MySQL Where	1
	MySQL Order By	1
	MySQL Delete Data	1
	MySQL Update Data	1
	MySQL Limit Data	1

JavaScript

JavaScript is a text-based programming language used both on the client-side and server-side that allows you to make web pages interactive. Where HTML and CSS are languages that give structure and style to web pages, JavaScript gives web pages interactive elements that engage a user.

Benefits

Speed. Client-side JavaScript is very fast because it can be run immediately within the client-side browser.
Simplicity. JavaScript is relatively simple to learn and implement.
Popularity.
Interoperability.
Server Load.
Gives the ability to create rich interfaces.

Module 1

Content	Description	No. of sessions
JS Tutorial	JS Introduction	1
	JS Where To apply	1
	JS Output	1
	JS Statements	1
	JS Syntax	1
	JS Comments	1
	JS Variables	1
	JS Let	1
	JS Const	1
	JS Operators	1
	JS Arithmetic	1
	JS Assignment	1
	JS Data Types	1
	JS Functions	1
	JS Objects	1
	JS Events	1
	JS Strings	1
	JS String Methods	1
	JS String Search	1
	JS Numbers	1
	JS Number Methods	1
	JS Arrays	1
	JS Array Methods	1
	JS Array Sort	1
	JS Array Iteration	1
	JS Array Const	1
	JS Dates	1
	JS Date Formats	1
	JS Date Get Methods	1
	JS Date Set Methods	1
	JS Random	1
	JS Booleans	1
	JS Comparisons	1
	JS Conditions	1
	JS Switch	1
	JS Loop For	1
	JS Loop For In	1
	JS Loop For Of	1
	JS Loop While	1
	JS Break	1
	JS Typeof	1
	JS Type Conversion	1
	JS Bitwise	1
	JS RegExp	1
	JS Errors	1
	JS Scope	1
	JS Classes	1
	JS JSON (Theory)	1
	JS Debugging	1
	JS Style Guide	1
	JS Best Practices	1
	JS Reserved Words	1

Module 2

Content	Description	No. of sessions
JS Objects	Object Definitions	1
	Object Properties	1
	Object Methods	1
	Object Display	1
	Object Accessors	1
	Object Constructors	1
	Object Prototypes	1
	Object Reference	1
	Object Map()	1
	Object Set()	1

Module 3

Content	Description	No. of sessions
JS Functions	Function Definitions	1
	Function Parameters	1
	Function Invocation	1
	Function Call	1
	Function Apply	1
	Function Closures	1

Module 4

Content	Description	No. of sessions
JS Classes	Class Intro	1
	Class Inheritance	1
	Class Static	1

Module 5

Content	Description	No. of sessions
JS Async	JS Callbacks	1
	JS Asynchronous	1
	JS Promises	1
	JS Async/Await	1

Module 6

Content	Description	No. of sessions
JS HTML DOM	DOM Intro	1
	DOM Methods	1
	DOM Document	1
	DOM Elements	1
	DOM HTML	1
	DOM Forms	1
	DOM CSS	1
	DOM Animations	1
	DOM Events	1
	DOM Event Listener	1
	DOM Navigation	1
	DOM Nodes	1
	DOM Collections	1
	DOM Node Lists	1

Module 7

Content	Description	No. of sessions
JS Browser BOM	JS Window	1
	JS Screen	1
	JS Location	1
	JS History	1
	JS Popup Alert	1
	JS Cookies	1

Module 8

Content	Description	No. of sessions
JS Web APIs	Web API Intro	1
	Web Forms API	1
	Web Worker API	1
	Web Fetch API	1
	Web Geolocation API	1

Module 9

Content	Description	No. of sessions
JS AJAX	AJAX Intro	1
	AJAX XMLHttp	1
	AJAX Request	1
	AJAX Response	1
	AJAX XML File	1
	AJAX PHP	1

Module 10

Content	Description	No. of sessions
JS vs jQuery	jQuery Selectors	1
	jQuery HTML	1
	jQuery CSS	1

MySQL

MySQL is a relational database management system based on SQL – Structured Query Language. The application is used for a wide range of purposes, including data warehousing, e-commerce, and logging applications. The most common use for mySQL however, is for the purpose of a web database.

Benefits

Data Security.
On-Demand Scalability.
High Performance.
Round-the-clock Uptime.
Comprehensive Transactional Support.
Complete Workflow Control.
Reduced Total Cost of Ownership.
The Flexibility of Open Source.

Module 1

Content	Description	No. of sessions
SQL Tutorial	SQL Intro	1
	SQL Syntax	1
	SQL Select	1
	SQL Select Distinct	1
	SQL Where	1
	SQL And, Or, Not	1
	SQL Order By	1
	SQL Insert Into	1
	SQL Null Values	1
	SQL Update	1
	SQL Select Top	1
	SQL Min and Max	1
	SQL Count, Avg, Sum	1
	SQL Like	1
	SQL Wildcards	1
	SQL In	1
	SQL Between	1
	SQL Aliases	1
	SQL Joins	1
	SQL Inner Join	1
	SQL Left Join	1
	SQL Right Join	1
	SQL Full Join	1
	SQL Self Join	1
	SQL Union	1
	SQL Group By	1
	SQL Having	1
	SQL Exists	1
	SQL Any, All	1
	SQL Select Into	1
	SQL Insert Into Select	1
	SQL Case	1
	SQL Null Functions	1
	SQL Stored Procedures	1
	SQL Comments	1
	SQL Operators	1

Module 2

Content	Description	No. of sessions
SQL Database	SQL Create DB	1
	SQL Drop DB	1
	SQL Backup DB	1
	SQL Create Table	1
	SQL Drop Table	1
	SQL Alter Table	1
	SQL Constraints	1
	SQL Not Null	1
	SQL Unique	1
	SQL Primary Key	1
	SQL Foreign Key	1
	SQL Check	1
	SQL Default	1
	SQL Index	1
	SQL Auto Increment	1
	SQL Dates	1
	SQL Views	1
	SQL Injection	1
	SQL Data Types	1

Angular / React

Angular is a Javascript framework that is used by developers for building web, desktop, and mobile applications. Development of Angular applications involves usage of Typescript, which is a superset of Javascript, along with HTML, CSS etc.

React (also known as React. js or ReactJS) is an open-source, front end, JavaScript library for building user interfaces or UI components. React can be used as a base in the development of single-page or mobile applications.

Benefits of Angular

Functionality out of the box. The default setup of Angular gives you everything you need, right out of the box.
TypeScript. Angular is built with TypeScript.
Consistency.
Productivity.
Maintainability.
Modular development structure.
Angular Material.

Benefits of React

Virtual DOM in React makes the user experience better and developer’s work faster. …
Permission to reuse React components significantly saves time. …
One-direction data flow in ReactJS provides a stable code. …
An open-source Facebook library: constantly developing and open to the community.

Node JS

Node. js is primarily used for non-blocking, event-driven servers, due to its single-threaded nature. It’s used for traditional web sites and back-end API services, but was designed with real-time, push-based architectures in mind.

Benefits

Node. js offers an Easy Scalability.
Easy to Learn.
Node.
The Benefit of Fullstack JS.
Known for Offering High Performance.
The Support of Large and Active Community.
The Advantage of Caching.
Offers the Freedom to Develop Apps.

MongoDB

MongoDB is a document-oriented database which stores data in JSON-like documents with dynamic schema. It means you can store your records without worrying about the data structure such as the number of fields or types of fields to store values. MongoDB documents are similar to JSON objects.

Benefits

Document Oriented Storage − Data is stored in the form of JSON style documents.
Index on any attribute
Replication and high availability
Auto-Sharding
Rich queries
Fast in-place updates
Professional support by MongoDB.

Module 1

Content	Description	No. of sessions
MongoDB	MongoDB Get Started	1
	MongoDB Create Database	1
	MongoDB Create Collection	1
	MongoDB Insert	1
	MongoDB Find	1
	MongoDB Query	1
	MongoDB Sort	1
	MongoDB Delete	1
	MongoDB Drop Collection	1
	MongoDB Update	1
	MongoDB Limit	1
	MongoDB Join	1