Fundamentals of CSS

• Cascading Style Sheets (CSS): Control layout and design of web pages.
• Types:
  • Inline styles within HTML tags.
  • Internal styles using the <style> tag.
  • External stylesheets (.css files linked to HTML).

CSS Selectors

• Select elements by:
  • Tag name (e.g., p)
  • Class (e.g., .class)
  • ID (e.g., #id)
  • Attributes (e.g., [type="text"])
  • Pseudo-classes (e.g., :hover)
  • Pseudo-elements (e.g., ::after)

Color and Backgrounds

• color and background-color properties.
• Use linear-gradient() for gradient backgrounds.
• Background new_images via background-image.

Fonts

• font-family to specify font types.
• font-size controls text size.
• Import fonts from Google Fonts.
• Use fallback fonts for compatibility.

Text Properties

• text-align, text-decoration, letter-spacing, line-height, text-transform.

CSS Float

• Floats elements to the left or right.
• Requires clearing floats using clear: both; to avoid layout issues.

CSS Box Model

• Each element consists of: content + padding + border + margin.
• Manages spacing and sizing visually.

CSS Display

• Display types: block, inline, inline-block, none (hide elements), flex, grid.

Flexbox

• One-dimensional layout for aligning items horizontally or vertically.
• Key properties: justify-content, align-items, flex-direction.

Responsive Web Design

• Adapt layouts using @media queries.
• Use scalable units: %, vh, vw, em, rem.

Introduction

• JavaScript enables interactivity on web pages.
• Runs on the client-side and is supported by all modern browsers.

Variables and Outputs

• var, let, const: ES6 introduced let and const for better scoping.
• Output methods: alert(), console.log(), document.write().

Data Types

• Strings, numbers, booleans, null, undefined, and symbols.

Conditional Statements

• if, else if, else, and switch for decision making.

Loops

• for, while, do...while loops for repeating code blocks.

Functions

• Reusable blocks of code with parameters and return values.
• Example syntax: function myFunc() { }

Scope

• Local vs Global variables.
• Hoisting: Function and variable declarations are moved to the top during execution.

Arrow Functions

• Shorter syntax for functions: const add = (a, b) => a + b;
• Lexical this binding.

Arrays

• Store ordered collections of data.
• Common methods: push(), pop(), shift(), map(), filter().

Objects

• Key-value pairs, e.g., { name: "John", age: 30 }.
• Access properties via dot notation or bracket notation.

Event Handling

• Events like onclick, onmouseover, onchange.
• Use addEventListener for flexible event binding.

DOM & BOM

• DOM: Access and manipulate HTML elements and structure.
• BOM: Browser Object Model provides APIs like window, navigator.

JSON

• Data exchange format (JavaScript Object Notation).
• JSON.stringify() and JSON.parse() for working with API data.

Role of jQuery

• Simplifies DOM manipulation and event handling.

Getting Started

• Use via CDN or download. Requires jQuery library.

Basic Syntax

• $(selector).action(), e.g., $("#btn").click().

Selectors

• Same as CSS selectors: #id, .class, element tags.

Events

• Attach behaviors like click(), hover(), submit().

Show/Hide/Toggle

• UI visibility changes with show(), hide(), toggle().

Fading Effects

• Animate opacity using fadeIn(), fadeOut().

Sliding Effects

• Vertical transitions with slideUp(), slideDown().

Animations

• Animate any CSS property. Use stop() to interrupt.

Chaining

• Combine multiple actions, e.g., $(selector).css().slideUp().fadeOut();

Bootstrap Intro

• CSS framework for responsive UI development.
• Includes grid system and prebuilt components.

Getting Started

• Include Bootstrap via CDN or install locally.

Containers & Typography

• .container, .container-fluid for layout.
• Text utilities for alignment, size, and colors.

Grid System

• 12-column layout with breakpoints: col-sm, col-md, etc.

Tables & Forms

• Style tables using .table.
• Form controls styled with .form-control.

Buttons & new_images

• Predefined button styles with .btn.
• Responsive new_images via .img-fluid.

Cards

• Flexible content containers for text, new_images, and links.

Components

• Navs, navbars, accordions, breadcrumbs, pagination, modals, spinners, tooltips, popovers, alerts, carousels.

PHP Basics

• Open-source scripting language executed on server.

Syntax

• <?php ?> tags, semicolons, comments (//, /* */).

Constants and Variables

• Define constants: define("SITE", "MySite");
• Dynamic typing: $x = "hello";

Echo/Print

• Output data to browser using echo or print.

Data Types

• Strings, numbers, arrays, objects, null.

String Functions

• strlen(), strpos(), str_replace(), etc.

Operators and Conditions

• Arithmetic, comparison, logical operators.
• Control structures: if, switch, while, for.

Arrays & Objects

• Loop through arrays and create class instances.

Functions

• User-defined functions with parameters and return values.

Forms & Validation

• Validate user input from $_POST or $_GET.

Sessions & Cookies

• Manage user state across pages.

File Handling & Emails

• Read/write files and send emails via mail() or SMTP.

JSON, Filters

• Data formatting and input sanitation using filter_var().

MySQL Integration

• CRUD operations using mysqli or PDO.

SQL Basics

• Used to manage and query relational databases.
• Supports simple data retrieval to complex operations.

Core Query Commands

• SELECT: Retrieve data from one or more tables.
• WHERE: Filter records based on conditions.
• JOIN: Combine rows from multiple tables.
• GROUP BY: Aggregate data by specified columns.
• ORDER BY: Sort query results by one or more columns.

DDL (Data Definition Language)

• CREATE: Create tables or databases.
• DROP: Delete tables or databases.
• ALTER: Modify existing table structure.

DML (Data Manipulation Language)

• INSERT: Add new records.
• UPDATE: Modify existing records.
• DELETE: Remove records.

Laravel Basics

• MVC framework for PHP development.
• Uses Eloquent ORM for database interactions.
• Install Laravel via Composer.

Artisan CLI

• Built-in command-line interface.
• Examples: php artisan make:controller, migrate, serve.

Routing, Middleware

• Define URL routes in web.php or api.php.
• Use middleware to filter requests and control access.

Controllers, Views (Blade)

• Controllers handle business logic.
• Blade templates render dynamic views.

Models, Migration

• Define database schema using migrations.
• Interact with data using Eloquent models.

API and Web Routes

• Use routes/api.php for REST APIs.
• routes/web.php for browser-based routes.

Validation, Sessions

• Validate requests using FormRequest or directly in controllers.
• Manage user data across requests using sessions.

Mail, Queue, Helpers

• Send emails using Mailtrap during development.
• Queue background jobs for async processing.
• Useful helpers: url(), asset(), etc.