Forem: Yaswanth K N

Django FrameWork

Yaswanth K N — Thu, 15 Jun 2023 16:09:53 +0000

It is a python framework developed for rapid development of web applications
The following are some of the core concepts of the framework

Secret Key :

This is the key present in the settings.py file which is randomly generated by django for security purpose
Project will not run without the secrete key. If you try to runserver without secret key, It will throw a message saying "Please contact admin"
This Secret key is used in Criptographic signing in django
Example Snippet -Run the code inside django shell

>>> from django.core.signing import Signer
>>> signer = Signer()
>>> value = signer.sign("My string")
>>> value
>>>'My string:GdMGD6HNQ_qdgxYP8yBZAdAIV1w'
>>> unsign = signer.unsign(value)
>>>"My string"

The above code generate the random signed value based on secret key
If we remove or alter the secret key all the signed values will be last
It is helpfull in data hiding or password redirecting page etc

Default Django Apps

django.contrib.admin : This is responsible for django admin page and creating superuser etc
django.contrib.auth : django has some inbuilt user authentication system which is coming from auth app
django.contrib.contenttypes : This allows us to create a general model which has foreign key of ContentType that can be reused for different models in the project

django.contrib.sessions It is sessions framework used to manage user sessions in the web application

django.contrib.messages: This is used to send messages to the templates while redirecting. e.g: Success Message, Error Messages in forms etc

CSRF

Cross Site Request Forgery is a technique where attacker makes user to click on some link which make some JavaScript code run making request to the targetted website and sends the required payload by taking advantage of user session
This can be avoided by using csrf tokens which are related to user session
In django, Forms should have csrf token, The Token is passed to the server side along with payload and validation is done at the server side.

XSS

Cross Site Scripting is a technique where attacker's send the script or html that is harmful as a input
To prevent this django automatically escapes the user generated content which have html script
We have an option to turn it off as incase if we want to render html itself

Click Jacking

Clickjacking is a type of attack where a malicious site wraps another site in a frame. This attack can result in an unsuspecting user being tricked into performing unintended actions on the target site.
Django uses XFrameOptionsMiddleware to prevent this

Middleware

These are the layers that are present between webserver and the views
The request that browser makes will go to web server and from there it will pass through all the middle layers called middlewares and reaches the view
View will send a response which again will pass through the middle layers for adding addtional contents
Middlewares are helpfull in filtering the requests, for example if a form without csrf tocken is posted, request will not reach till view because csrf layer will return it to browser with exception
Some of the Default middlewares that django have are:


MIDDLEWARE =  [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

WSGI

Web Server Gateway Interface : It is interface between web server and a framework like django
wsgi is a specification that should be followed in the request , response flow
This helps in writing a server side scripts independent of web server

Models

Foreign Key

In django models if the field is foreignKey, we need to pass two arguments to it
ONE: Model class name to which it is refering
TWO: Property- on_delete: on_delete=models.CASCADE : This will delete the record in the model, if object of parent model is deleted from the database on_delete=models.RESTRICT : allows deletion of child only if all of its owners(parents) are deleted in past or currently are being deleted on_delete = models.SET_NULL: Let parent gets deleted but set child to null on_delete = models.PROTECT : Let parent gets deleted but child will not

Fields and Validators

Some Common Fields :

null :

This can be true or false, default will be false, if true, django will store the Empty values as null

blank:

This can be true or false, default will be false. This is for form validation purpose
if blank is true, then form will validate else user will have to give the input

choices:

This will take array of tuples having two values [(a1,b1),(a2,b2)]
First value of tuple is the value of model object and second element is human readable option

db_index:

-django will create index for the field in the table for faster searching

default:

This will be the default value if nothing is provided in the field
It can be a callable function which returns some value

primery_key:

Django will automatically provides primery key column, if no field with pk is provided
If you want to make a field primery , make preimery_key = True

unique:

Values in the field should be unique, if true. default will be false
unique implise creating a index so no need to provide db_index

validators:

This will take a list of validation functions which will rise ValidationError if fails

Field Types:

models.CharFiled(max_length=20)

Takes in the text value of size less than max_length

models.IntegerField():

Takes integer value

models.DateField(auto_now=False, auto_now_add=False):

This takes the date value
if auto_now is true, this will updates the data every time it is saved
if auto_now_add = True, then it will assign the date to at the time of creation only

models.DateTimeField(auto_now=False,auto_now_add=False):

In addition to date, time also added and both the properties work the same way

models.EmailField(max_length=254_, **options):

This checks if the given email is valid or not by Email Validator

models.SlugField(_max_length=50_, _**options_):

-This is generally used for url storage

Validators:

from django.core.validators import <validator_name>

Some of the commonly used validators are

validate_email(email): Validates Email
MaxLengthValidator(text) : reises validation error if text is greater than given length
MinLengthValidator(text) : reises validation error if text is less than given length
URLValidatior(url) : checks if url is valid or not
validate_slug(slug) : checks for slug
validate_integer(number) : checks if it is integer or not

We can write our own custom validator functions and pass them to fields

Django ORM

Using django SHELL:

Following command to move into django shell

python manage.py shell

Import the models that we want to work with

>>> from app.models import ModelName
>>> from django.db.models import Count,Sum,Min,Max
>>> querySet = ModelName.objects.all()
>>> ModelName.objects.filter(attribute__gt = value)
>>> ModelName.objects.values("Attribute1").annotate(Count("Attribute2"))
>>> ModelName.objects.aggregate("id")

The above are some of the commonly used queries, filter will result a query set with all the records that satisfy condition
values() before annotate will act as a group by and aggregate functions can be applied on them

Turning ORM to SQL

To know the sql query that orm is going to exicute use query attribute of querySet in the shell

example:

move to shell

python manage.py shell

open shell and perform


>>> from app.models import ModelName

>>> querySet = ModelName.objects.filter(attribute=value)
>>> print(querySet.query)
 # SQL Query which orm is going to excicute will be printed here

AGGRGATIONS:

These are special mathematical operations that can be performed on Fields(vertically)
The common aggrigate functions are SUM, COUNT, MIN, MAX, AVG etc
Aggrigate functions should be imported from django models class Example
Move to shell

>>> from app.models import ModelName
>>> from django.db.models import Count,Sum,Min,Max,Avg
>>> ModelName.objects.aggregate(Count("id"))
>>> ModelName.objects.aggregate(Sum("Attribute"))
>>> ModelName.objects.aggregate(Avg("Attribute"))
>>> ModelName.objects.aggregate(Min("Attribute"))

ANNOTATIONS

Annotations are used to add an extra field to the query set object

Example:

>>> from app.models import ModelName
>>> from django.db.models import Count,Sum,Min,Max,Avg
>>> queryset = ModelName.objects.annotate(count = Count("id"))

Here each queryset object will have attribute 'count'

What is a migration file? Why is it needed?

Migrations files are generated by django when we hit command

python manage.py makemigrations  # It will show the changes that it's going to make

python manage.py migrate # This will change the state of database

django will keep track of all the changes that we do the models as a files with dependencies on each other in a migrations folder
ORM will check for the state of database when we hit migrate .if it come accross any changes it will try to do that in the process if any interruption happens because of some migrations file missing etc, it will collapse the database.

What are SQL Transactions

Transactions in SQL are the bundle or set of operations that are performed for one functionality.
Transaction involves one or more database operations
These will make sure that either all the operations are successful or non of them exicutes, so that consistency has maintained in the database

ATOMIC TRANSACTIONS

These are the transactions that make sure the operations should be performed as a whole not individually
Since django uses the auto save, transactions are default not atomic
So, to make them atomic, we can use transactions from django.db


from django.db import transaction

@transaction.atomic
def viewfunc(request):
    # This code executes inside a transaction.
    do_stuff()

Using Context manager

def  view(self,  *args  ,  **options):

    with transaction.atomic():
        # db operations

Asynchronous JavaScript

Yaswanth K N — Thu, 01 Jun 2023 11:51:01 +0000

Asynchronous code can make a program run parellely without blocking,while performing a big task that takes in more time to complete.
For Example: readFiles in JS are asynchronous meaning, JS will not wait for readFile() to complete it's operations
So, Generally to handle these asynchronous operations we use callbacks, Promises, async and await.

CallBacks

These are the functions that we pass as a reference to another function which will call this callback function somewhere in it's exicution.
Callback functions generally used while handling asynchronous operations with some if conditions

Example:


function callback(){
    console.log("I am a callback function called after 2 seconds");
}
function asynchronous_fun(callback){

    setTimeout(()=>{
        callback();
    },2000);

}

asynchronous_fun(callback);
// Outout will be printed after two seconds

In the above example, we have used setTimeout() which is a async function and will call the callback function after two seconds.
That's why it is printing after 2 seconds
In the above operation javascript engine will not wait till setTimeout() function exicute callback function.
So, we used callback technique to ensure our callback function exicuted after 2 seconds
Callbacks can be used to control the order of operations that we perform in a async code

example:


function  f1(){
    setTimeout(()=>{
        console.log("f1");
        f2(f3);
    },1000);
}

function  f2(){
    setTimeout(()=>{
        console.log("f2");
        f3();
    },3000);
}

function  f3(){
    setTimeout(()=>{
        console.log("f3")
    },2000);
}
f1(); // f1 f2 f3

In the above example, we have used callbacks for sequence exicution, otherwise it would have been a random exicution.

Promises

Promise is a object in JavaScript which is useful in maintaining a better code control than a callback
Promise will have three states
- pending : while the exicution is going on
- fullfilled : when exicution is successfully completed
- rejected : some error has occured during exicution
we generally use promise to handle asynchronous code in javascript
Promise object will have two functions
- .then(): It will have data from the object if promise is fullfilled
- .catch(): It will have error object if promise is rejected

Example:

//Promise object
const promise = new Promise((resolve,reject)=>{
    // Do operations here
    const result = "Hi, I am a promise returning successfuly"
    let error = false;
    if(!error){
        resolve(result);
    }else {
        reject("Some error has occured while fullfilling promise")
    }
});

//Collecting result from promise

promise().then((response)=>{
    console.log(response); // This will print the result message
}).catch((error_message)=>{
    console.log(error_message); //This will print message that was passed to reject function incase of rejection in promise
});

We can use promise chaining to have sequnetial exicution of asynchronous operations
This is more cleaner way of writing code instead of using callbacks.

Code Control

It is the process of making the asynchronous code exicute in a required sequence
This can be achieved with various techniques like callbacks, Promises async and await as i said earlier
Let's take the same example of callbacks and how we achieved code control
we have three functions which have differenet exicution times. so, If we remove callbacks in the code and we run it output will be as shown

example:


    function  f1(){
        setTimeout(()=>{
            console.log("f1");
            //f2(f3);
        },1000);
    }

    function  f2(){
        setTimeout(()=>{
            console.log("f2");
            //f3();
        },3000);
    }

    function  f3(){
        setTimeout(()=>{
            console.log("f3")
        },2000);
    }

    f1();
    f2();
    f3();

//Output : f1 f3 f2

So, as we can see the output is not in our control or it's not working as per our requirement
So, to make it work uncomment the callback functions and run only f1() function, you will see that the output is in the order ( f1 f2 f3 ).
This is called code control
we have achieved this using callback functions
we can also use Promises, async and await to achieve code control

References

JavaScript

Yaswanth K N — Tue, 30 May 2023 05:13:27 +0000

Loops:

`for`:

It is a basic for loop used to iterate through iterable

example:

let arr = [1,2,3,3,4,5,6,7];
for(let i = 0; i < arr.length; i++ ){
    console.log(arr[i]);
    }
// Output: prints all the elements of array we can use same loop for strings also

`forEach`:

It is a higher order function in javascript which takes in another function as a reference

example:

let arr = [1,2,3,4,5,6];
arr.forEach((num)=> num * 2);
console.log(arr);
//Output: Array of elements which are doubled

`for .. in`:

It is a looping technique majorly used to iterate over object

example:


let person = {
    fname : "raj",
    lname : "kailash",
    age : 23
    location : "banglore";
}

for(let key in person){
    console.log(`${key} : ${person[key]}`);
}

`for .. of`:

This will return the each element of a array

example:

let arr = [1,2,3,3,4,5,6,7];
for(let ele of arr){
    console.log(ele)
}
//Output: prints all the elements of array

`while` :

It is one of the most basic technique to loop through elements

example:


let arr = [1,2,3,3,4,5,6,7];
let index = 0;
while(index < arr.length){
    console.log(arr[index]);
}

//Output: prints all the elements of array

Mutable vs Immutable

Mutable are those whose value can be changed without creating a entire new object

example: Objects , arrays.

Immutable: Value can't be changed unless you create a new object example: Strings, Primitive datatypes etc.

Pass by Reference and Pass by Value

Pass by Value :

System will create it's own copy and value of variable will not change outside of block

example:


let num = 10;
function multiply(num , n){ 
    num = num*n;
    return num;
} 
 const res = multiply(num,2);
 console.log(num); // 10
 console.log(res); // 20

In the above example num value have not changed even though we pass the same variable to the function, because system will create seperate copy of num and modify that

Pass by Reference:

All the objects in javascript are passed by reference
Even if you change it's value inside a function it will change the object

let  person  = {
fname :  "raj",
lname :  "kailash",
age :  23,
location :  "banglore"
}

function  locationUpdate(person){
person["location"] =  'Vizag';
}
locationUpdate(person);
console.log(person);
// You will see location changed to vizag

Here the person object is passed by refernce hence it is changing it's property value inside function

Array Methods

`Array.pop()`:

removes the last element of a array and returns it's value

let arr = [1,2,3,3,4,5,6,7];
console.log(arr.pop()); // 7

`Array.push()`:

Appends the elements at the end of array

let arr = [1,2,3,3,4,5,6,7];
arr.push(10);
console.log(arr) // 10 is added at the end

`Array.concat()`:

Addes two arrays and returns the new array

let arr1 = [1,2,3,3,4,5,6,7];
let arr2 = [1,2,3,3,4,5,6,7];
const new_arr = arr1.concat(arr2); 
console.log(new_arr) // [1,2,3,4,5,6,7,1,2,3,4,5,6,7]

`Array.slice()`

It takes two values start,end indexes
returns new array with values between specified indexes.

let arr = [1,2,3,3,4,5,6,7];
const new_arr = arr.slice(0,3);
console.log(new_arr); // [1,2,3]

`Array.splice()`

It will remove elements from the given array
Takes two values index and number of elements you want to delete


let arr = [1,2,3,4,5,6,7];
arr.splice(0,3);
console.log(arr); // [4,5,6,7]

`Array.join()`

returns a string joining each element by given argument


let arr = [1,2,3,4,5,6,7];
const str = arr.join(" ");
console.log(str) // 1 2 3 4 5 6 7

`Array.flat()`:

It will unbox all the elements inside a array which are nested elements

const arr = [1, 2, [3, [4, 5, 6], 7], 8];
const new_arr = myArr.flat();
console.log(new_arr) // [1,2,3,4,5,6,7,8]

Finding:

`Arrays.find()`:

This will take boolean function reference as a argument and returns the first value in it's array which passes the function
If no element is found it will return undefined

let arr = [1,2,3,4,5,6,7];

const res  = arr.find((ele)=>{
    return ele > 5; 
});
console.log(res); // 6 since it is the first element which is greater than 5

`Arrays.indexOf()`:

It will return the index of first element that it find

const fruits = ["Banana", "Orange", "Apple", "Mango"];  
let index = fruits.indexOf("Apple");
console.log(index); // 2

`Array.includes()`:

returns true if the element is present else returns false
we can also optionly give another parameter as a start value which by default is zero

const fruits = ["Banana", "Orange", "Apple", "Mango"];  
let bool = fruits.includes("Apple");
console.log(bool) ;// true

`Arrays.findIndex()`:

takes the reference of a boolean returning function and returns the index of element that first passes the constion
returns -1 if no element passes the test

let arr = [1,2,3,4,5,6,7];

const res  = arr.findIndex((ele)=>{
    return ele > 4; 
});
console.log(res); // 4

Higher Order Functions

`Arrays.forEach()`:

This takes in the function as a argument and changes the existing array according to the argument function

let arr = [1,2,3,4,5,6,7];

arr.forEach((ele)=>{
ele = ele*2;
});

console.log(arr) // [2,4,6,8,10,12,14]

`Array.map()`:

This takes in the function and will not modify the array and returns new array with modified values
It will apply given function on each element of array


let arr = [1,2,3,4,5,6,7];

const new_arr = arr.map((ele)=>{
    return ele*2
});
console.log(new_arr) // [2,4,6,8,10,12,14]

`Array.filter()`:

This will take a function as a argument which returns boolean value
It will apply given function on each element of array
this will return all the elements that passes the boolean constion

let arr = [1,2,3,4,5,6,7];

const new_arr = arr.filter((ele) => {
    return ele > 3;
});
console.log(new_arr); //4,5,6,7

`Arrays.reduce()`:

This method will take two arguments one is the function and the other one is the initial value
The argument function will further take two arguments which are accumilator and current element

let arr = [1,2,3,4,5,6,7];
const sum = arr.reduce((acc,curr)=>{
    acc += curr;
    return acc;
},0)

console.log(sum); // 28

`Arrays.sort()`:

This method will take a function as a argument and sort depending on the result of that function
The given function will also take two arguments which are compared to return positive, negitive or zero value

const sorter = inventory.sort((a,b)=> {
    if (a.car_year > b.car_year){
        return 1;
    }else if (a.car_year < b.car_year){
        return -1;
    }
    return 0
});

depending on the returned value array is sorted accordingly

Array methods chaining

Using of higher order functions on output of other higher order function is called array method chaining

console.log(inventory.filter((car)=>{
if(car.car_make  ===  'Audi'  ||  car.car_make  ===  'BMW'){
    return  true;
}else  return  false;
})
.reduce((acc, curr)=>{
    acc.push({id :  curr.id , car_year :  curr['car_year']});
    return  acc;
},[]))

In the above code in inventory array first filters out the car_maker and pass the result to reduce function to output in given format

String Methods

`string.charAt()`:

returns the character at given index

let str = "abcd efg hij"
console.log(str.charAt(0)) // a

`string.concat()`:

appends two strings

let str1 = "abcd";
let str2 = "efgh";

let new_str = str1.concat(str2);
console.log(new_str);

`string.length`:

returns the length of string as integer

let str = "abcdef"
console.log(str.length); // 6

`string.toUpperCase()`:

returns the new string in upper case letters

let str = 'abcdef';
console.log(str.toUpperCase()) // ' ABCDEF'

`string.toLowerCase()`:

returns the new string in lower case letters

let str = 'ABCDEF';
console.log(str.toLowerCase()) // 'abcdef'

`string.split()`:

splits the string at given argument and returns array of strings

let arr = 'abcd efgh'.split(' ');
console.log(arr) // ["abcd", "efgh"]

`string.substring()`:

returns the substring of string with given arguments
It takes two arguments start and end(exclusive)


let str = 'abcdefg';
console.log(str.substring(1,5)) // "bcde"

Object Methods

Assigning:

let  person  = {
    fname :  "raj",
    lname :  "kailash",
    age :  23
}

person["location"] = "banglore"; // Assigning a new property to a object

Checking:

in key word is used to check if property is present or not

let  person  = {
    fname :  "raj",
    lname :  "kailash",
    age :  23,
    location : "banglore"
}

console.log("fname" in person) // true

`Object.keys()`:

returns the keys array iterable object

let  person  = {
    fname :  "raj",
    lname :  "kailash",
    age :  23,
    location : "banglore"
}

const keys = Object.keys(person);
for(let key of keys){
    console.log(key) // Prints all the keys of person object
}

`Object.values()`:

returns the all the values of a object as a array

let  person  = {
    fname :  "raj",
    lname :  "kailash",
    age :  23,
    location : "banglore"
}

const values = Object.values(person);
for(let value of values){
    console.log(value) // Prints all the values of person object
}

`delete object[key]`:

it will remove the entire property and it's value from object

let  person  = {
    fname :  "raj",
    lname :  "kailash",
    age :  23,
    location : "banglore"
}

delete person["location"];
console.log(person) //prson object will not have location property

`Object.entries()`:

This will return a array of key, value pairs as a array

let  person  = {
    fname :  "raj",
    lname :  "kailash",
    age :  23,
    location : "banglore"
}
const entries = Object.entries(person);

for(let pair of entries){
    console.log(pair) //[key , value]
}

Hoisting

It is special property of javscript where we can use the variables or functions without declaring first

console.log(b); //It will print undefined not error
var b

Hoisting is posible only with variables declared using var key word

Scopes

There are two types of scopes of variables or functions
Global Scope : variables which can be accessed any where in the program is called global scoped varibales
Local Scope: The access is limited to a block

let a = 10; // global scope
if(a){
    let b = 5; // Local scope or block level scope
    console.log(b) // prints 5 
    console.log(a) // prints 10 
}
console.log(a) // prints 10 
console.log(b) // Throws error

Closures

It is process where fucntion is declared and returned inside another function
It helps in improving privacy
for example if you want to increase a variable value only inside a function not on outside(global scope)

function sum() {
    let a = 0;
    function increaseSum() {
        // the value of a is increased by 1
        return a = a + 1;
    }
    return increaseSum;
}
let x = sum();
let a = 5;
console.log(x()); // 1
console.log(x()); // 2
console.log(a); // 5

Debugging

Debugging in javascript can be done in multiple ways
console.log(): Most commonly used debugging technique
console.trace(): returns the function call stack
console.time() and console.timelLog(): this gives the time taken by a program from the time() to timeLog() function.
developer tools: browser provides developer tools which very handy to debugg a javascript code
Using break points in editor etc

References

HTML - CSS

Yaswanth K N — Wed, 24 May 2023 12:00:08 +0000

Box Model

Every element in html is a box
CSS Box Model have majorly Four properites
- Content
- Padding
- Border
- Margin
Content : This holdes the actual data of element and area that content takes is called content area
- Padding : The space that we give around the content is called padding and area that takes this space is called Padding area
Border: As name suggets it covers the padding area
Margin: It is the space that we give around element and area that margin takes is called Margin area
example:

<p> This is an element </p>


p {
   padding: 1px 2px 1px 2px;
   border: 2px solid black;
   margin: 2px 1px 2px 1px;

}

As shown in figure and above code things inside 'p' tag is called content
In the above css snippet, we have given padding using short hand property as follows padding : top right bottum left ;
we can use same short hand property for margin also
we have given border width to be 2px , border type as solid and colored it as black
finally we have given margin of top and bottom as 2px , left and right as 1px
- Width of box calculated as width = border + padding + width of the content
- Height of box calculated as height = border + padding + height of the content
- However we can mannualy specify the width and height of element

Inline Elements vs Block Elements

Inline Elements : Elements which does not block the entire screen width or parent element's width is called inline elements

These elements will take up the width that is only required

It will not start new line
Examples :

<span> span element </span>
<a href="#"> Anchor tag </a>
<strong> makes bold text </strong>
<b> bold element </b>
<input type="text">
<label> Label </label>
<button type="submit"> Submit </button>

Block Elements : Elements which takes up the entire width of viewport or parent element is called Block Elements

This will start a new line each time we use them
Examples :

<h1>All the header tages from h1 to h6 are block elements</h1>
<p> Paragraph Element</p>
<div> div element which acts as a container</div>
<section> section element</section>
<article> article element</article>
<footer> Footer element </footer>
<header> header tag</header>
<aside> aside bar</aside>
<nav> Nav bar</nav>

Positioning: Absolute and Relative

Absolute and relative are the general values that we give to position property of any element
There are other four properties that we use along with position property, they are top, bottum, right and left
these properties decides the position of a element e.g if we give left: 2px; it will make element start from 2px from it's position but from where that 2px space should be given is decided by relative and absolute property
Relative : If we give position property as relative, it will not break the flow of page and it will move element relative to its normal postion
Absolute : This property will make the element break from it's flow and check for immediate relative element according to which it will position.

If no element is found it will position according to body of page
example :

<div id="parent">
    <p id="relative-ele">This is relativly positioned element</p>
    <p id="absolute-ele"> This is absolutly positioned element </p>
</div>

```css
    #parent {
        position: relative;
    }
    #relative-ele {
        position: relative;
        left: 3px;
    } 
    #absolute-ele {
        position: absolute;
        right: 3px;
    }
```

Explanation :

In the above example, there is a parent container and two paragraph tags with their unique id's.
Paragraph tag with id as relative-ele will be placed 3px away from it's normal flow or normal position
As soon as you keep absolute property in second paragraph tag you can see element breaking from its flow
Now, If you don't keep parent element as relative position , since no parent element of p-element is relative, it will be placed 3px away from right of body tag of html page
If we keep parent element relative, this will make second p-element position according to parent element.

Common CSS Structural Classes

These are sudo classes in css which will help us to select the elements more conveniently and effectively without giving class and id to every element
Some of the comman classes are listed below

Example:

<div  id="container">
    <div  class="div">div 1</div>
    <div  class="div">div 2</div>
    <div  class="div">div 3</div>
    <div  class="div">div 4</div>
    <p> paragraph 1</p>
    <div  class="div">div 5</div>
    <p> paragraph 2</p>
    <div  class="div">div 6</div>
    <p> paragraph 3</p>
    <div  class="div">div 7</div>
    <div  class="div">div 8</div>
</div>

:nth-child(n): It will select the element which is the nth child of parent element

#container :nth-child(3) {
    /* Selected the third child of container */
}

:first-child: This will select the first child of a parent element

#container  :last-child{
    /*first child of container is selected*/
}

:last-child: This will select the last child of parent element

#container  :last-child{
    /*Last child of container is selected*/
}

:nth-of-type(): This will select every nth element of it's type

#container :nth-of-type(2){
    /*This will select the div 2 and paragraph 2 elements, since they 2nd elements of their type*/
}

:last-of-type : This will select every last element of it's type

#container :last-type{
    /*This will select the div 8 and paragraph 3, since they are the last elements of their type*/
}

:first-of-type : This will select every first element of it's type

#container :last-type{
    /*This will select the div 1 and paragraph 1, since they are the first elements of their type*/
}

nth-last-of-type(): This will select the every nth last element of their type

#container  :nth-last-of-type(2) {
    /* This will select div 7 and paragraph 2, they are the 2nd elements from last in their type*/
}

Common CSS Styling Classes

.container - Used to define a container element that holds the main content of a webpage. It is often used to center and control the layout of the page.
.header - Applied to the header section of a webpage, that usually contains the site's logo, navigation menu, or other introductory content.
.footer - Applied to the footer section of a webpage, that usually contains information such as copyright, contact details, or links to other pages.
.nav - Applied to a navigation menu element, such as an unordered list (<ul>) containing navigation links.
.button - Used to style buttons on a webpage, applying properties such as background color, text color, padding, and border.
.input - Applied to input fields, such as text fields, checkboxes, radio buttons, or dropdown lists.
.card - Used to create a card-like component, typically containing a combination of text, images, and other elements. Cards are commonly used to display content in a visually appealing and organized manner.
.alert - Applied to an element that displays important messages or notifications to the user, often styled with contrasting colors to grab attention.
.active - Applied to indicate the active state of an element, such as a selected navigation link or a highlighted item in a list.

CSS Specificity

When we try to apply different styling to the same element, CSS specificity comes handy
Because css will give priority based on type of selector
Given is the priority order of selectors
Inline Styling: This will have the highest specificity, it will override any other selectors.
This is useful for quick styling of elements
ID Selector: This have the highest specificity in external styling, This will override any other styling done using any selectors
ID selectors are helpfull to override styling
Class Selector, Atribute Selector, Sudo Selectors : All these have the specificity lower than id selector and have similar specificity amoung themselves
So, whichever selector is written last will be applied
Type Selector: This have lower specificity than class selectors and these can be easily overrided
Universal Selector(*): This have lowest specificity compared to any other selector

Major use case for CSS Specificity is that we can use it for ovverriding properties by using id selectors

CSS Media Queires

Media queries are used in css to make web page responsive to the size of viewport (screen)

Basic Syntax:

@media media-type and (media-feature){
/*Styles go here*/
}

In the above syntax media-type have different options to give depending on reqirement like screen, all, print and speach
media-feature can take various values like min-width, max-width , aspect-ratio etc
This media query can be understood as a if conditional statement in any programming language
If media-type and media-feature matches then apply the given styling

Example:

@media screen and (min-width: 300px) {
  body {
    background-color: black;
  }
}

In the above example, If the media-type is screen and screen width is greater than or equal to 300px, then it will change background-color of body to black
This way we can make a web page responsive to the media-type

FlexBox / Grid

FlexBox and Grid are the common techniques used when designing a web page for easy positioning of elements

FlexBox:

some commonly used properties of FlexBox
we will activate flexbox by giving display property as flex

flex-direction: row | column | row-reverse | column-reverse

The above property makes the flex items float depending on flex direction

This will move the items horizantlly if flex-direction is row or row-reverse and it will move flex items vertically if flex-direction is column or column-reverse

align-items: start | stretch | end | center

If flex-direction is row or row-reverse, Flexitems will vertically. If flex-direction is column or column-reverse then Flexitems will move horizantally
stretch property will make element to take entire height available

order: . . -2 | -1 | 0 | 1 | 2 . .

Positive number will push element order forward with respect to current position(rank)
Negitive number will decrease the rank by given number
Zero will not change the rank of element

Grid:

Grid is a table like structure having both columns and rows of specified size
CSS grid is a powerfull tool since we can navigate grid items both horizantally and vertically which is not possible using flexbox.
However with little more effort we can achieve evrything possible in grid using flexbox but grid makes it a bit easier.
Grid feature in css is enabled by giving display property as grid

grid-template-columns:

This takes the values that represents the size of columns and creates the number of columns

grid-template-rows:

Similar to above property, creates rows of specified sizes

justify-content:

This property will move the grid items horizantally in side grid

align-self:

This property will move the grid item vertically inside grid space
This is a grid item property

grid-column:

This is also grid item property which takes two values seperated by ' / '
first value represents the start number of column and second number represents the end of column
e.g : grid-column: 2/3;

grid-column:

This is also grid item property which takes two values seperated by ' / '
first value represents the start number of row and second number represents the end of row
e.g : grid-row: 2/3;

grid-area:

This is also grid item property which takes four values seperated by ' / '
grid-area: start-row-number/start-column-number/end-row-number/end-column-number
grid-area: 2/3/3/4;

row-gap :

This is a grid property that gives the space between rows

column-gap :

This is a grid property that gives the space between columns

CSS Meta Tags

Meta tags provide information regarding webpage that currently using
some of the majorly used meta tags are

<meta charset="UTF-8">: This meta tag specifies the character encoding for the webpage.
<meta name="viewport" content="width=device-width, initial-scale=1.0">: The viewport meta tag is used to control how the webpage is displayed on different devices and screen sizes. The width=device-width ensures the page width matches the device's width, and initial-scale=1.0 sets the initial zoom level to 1.0.
<meta name="description" content="Description of the webpage">: The description meta tag provides a brief summary or description of the webpage's content. It is often displayed in search engine results and can influence the page's ranking.
<meta name="keywords" content="keyword1, keyword2, keyword3">: The keywords meta tag specifies a comma-separated list of relevant keywords or phrases related to the webpage's content.
<meta name="author" content="Author Name">: The author meta tag indicates the author or creator of the webpage.

References

SOLID Principles

Yaswanth K N — Mon, 15 May 2023 10:14:53 +0000

These are five principles of object oriented programming, helps in writing clean code and build good architecture.
These are first introduced by Robert J. Martin (a.k.a Uncle Bob).
SOLID stands for :
- Single Responsibility Principle
- The Open-Closed Principle
- The Liskov Substitution Principle
- Interface Segregation Principle
- The Dependency Inversion Principle

Single Responsibility Principle

Simple definition is that a Class should be responsible for only one function

class Invoice:

    def calculate(self):
        # calculates total amount
    def print_invoice(self):
        # Prints invoice in given format 
    def save_invoice(self):
        # Saves to file

Explanation:

In the above example, let's say Invoice class will calculate and prints the invoice slip
So, here SRP is voilating.
Because, SRP states that there should be only one reason to change or modify a class
But in the above example, If you want to change the format of invoice printing you will have to change invoice class.
If you want to change some business logic in calculate method again you have to change the invoice class
So, here same class is responsible for two things Soluton:

class InvoiceCalculate:
    def calculate(self):
        # calculates total amount

class PrintInvoice:
    def print_invoice(self):
        # Prints invoice in given format 
class SaveInvoice:
    def save_invoice(self):
        # Saves to file

Here we are transporting three methods to three different class, as they have different functionalities

The Open-Closed Principle

This principle states that class should be closed for modification and open for extension
Meaning, If you want to add fuctionality to the class you don't want to change the existing code as this will arise bugs
Let's say if you want to save the invoice to both database and file
You can do as follows Example:

class SaveInvoice:
    def save_invoice(self):
        # Saves to file
    def save_invoice_database(self):
        # Saves to database

In the above code Open-Closed principle has been violated
Because, we are changing or modifying the existing class for adding a new functionality
So, to solve the above problem we can use abstraction Solution:
we will create SaveInvoice as a abstract class instead of concrete class and we will inherit the class to impliment the required function

from abc import ABC,abstractmethod
# Base class
class SaveInvoice(ABC):
    @abstractmethod
    def save(self):
        pass

# class to imliment save function to save invoice to file
class SaveToFile(SaveInvoice):
    def save(self):
        # Save to file

# class to impliment save function to save invoice to database
class SaveToDatabase(SaveInvoice):
    def save(self):
        # Save to database

In the above example we have used abstraction to overcome the problem of modifying the existing class
Even in future if we want to save invice to someother source we can always create a class corresponding to that and impliment save method from base class

The Liskov Substitution Principle

This principle states that Subclasses should be substitutable for their base classes
In other words, person who is using our code should not know which object he is implimenting or using

example:

This is closly related to the open closed priciple

from abc import ABC,abstractmethod
class polygone(ABC):
    def area(self):
        pass
class rectangle(polygone):
    def __init__(self,a,b):
        self.a = a
        self.b = b
    def area(self):
        return self.a*self.b
class square(polygone):
    def __init__(self,l):
        self.l = l
    def area(self):
        return self.l * self.l
rect = rectangle(a,b)
print(rect.area())
print(isinstance(rect,polygone))

The above example is similar to open-close principle
Here, we can replace rect object with parent object polygone
So, Lisko Substitution principle is followed

Interface Segregation Principle

The Interface Segregation Principle is about separating the interfaces.
Keep multiple interfaces for multiple use cases

from abc import ABC,abstractmethod
class sim(ABC):
    def call(self):
        pass
    def message(self):
        pass
    def network(self):
        pass

In the above example although the functionalities of these methods are different they are in same abstract class.
This will create obligation to impliment all the methods even though you want only call method

Solution

from abc import ABC,abstractmethod
class sim_call(ABC):
    @abstractmethod
    def call(self):
        pass
class sim_message(ABC):
    @abstractmethod
    def message(self):
        pass
class sim_network(ABC):
    @abstractmethod
    def network(self):
        pass

Here, we have used three seperate abstract classes for all these different functions

The Dependency Inversion Principle

The Dependency Inversion principle states that our classes should depend upon interfaces or abstract classes instead of concrete classes and functions.
This is related to the open-close principle
we can use the same example as in Open-close principle
If we observe the given example, we have removed the SaveInvoice class which is concrete class and replaced them with abstract class to achieve DI principle

References

freecodecamp

SQL Concepts

Yaswanth K N — Fri, 12 May 2023 12:45:51 +0000

ACID Properties

ACID stands for Atomicity, Consistency, Isolation and Durability.
These are some of the most basic properties of any scalable project

Atomicity

This ensures that all the database operations should be completed successfuly, Otherwise in any case database should role back to it's previus state
This ensures no leak of data and helps maintain data consistency

Consistency

Database will remain consistent at any given point of time
e.g Database will follow all the constraints, rules at any given time this helps to maintain consistent data

Isolation

Every transaction in a database is isolated
Multiple transactions will not interfare with each other, This will be achieved by using locking mechanism

Durability

This property refers to maintaining consistent data for long time
Even when the system crashes data could be restored

Implimentation

Locking mechanism ensures that transactions do not interfare with each other, hence helps to maintain Isolation
Data follows the given constriants at any point of time, e.g It will not allow duplicates in a primary key at any given time
Logging techniques are used to log transactions, so that even in case of system crash, we can role back to the transactions that we want,hence databases are durable
database will role back the entire transaction if it could not complete it successfuly, hence there is no concept of partial exicution

CAP Theorem

CAP stands for consistency, Availability, Partition Tolerance
In this article, I am going to explain cap theorem with an example
In case of distributed systems, every system should access the same data, this property is called Consistency
Even in case of failure of one system, others should be able to perform, this property is called availability
Even when the network breaks down application sholud perform it's operation, this property is called Partition Tolerance

Explanation

Let's take an example of todo-list app
since the traffic is high, we are using two netwroks(systems) to meet the demand
let's say for example, oneday client asks for a data from system1, but system1 don't have that data because system2 is handling that client and storing in system2
This problem is called Consistency problem, because system1 and system2 data are not same
To over come tha above problem let's say we have created a code where both systems exchange their data, so that consistency will be maintained
Now, After sometime system2 gets down due to some bug, then requests will have to be handled by system1 and then pass them to system2 to maintain consistency but system2 is down.
So, here we have two options either compromise on consistency or make entire application stop working.
This property is called Availability
In case of network break down between two systems, Then we need to chose consistency or availability
This is called Partition Tolerance

Conclusion

CAP theorem states that it's imposible to attain three properties in case of system break down, hence we have to choose
Most of Systems now a days choose AP, because consistency can be attained after somtime

Joins

As the name suggests Joins are used to used to join two tables based on the column that is common in both the tables
Some of the most commonly used joins are
- INNER JOIN
- LEFT JOIN
- RIGHT JOIN
- SELF JOIN

INNER JOIN

INNER JOIN key word is used to join two tables which have same values

    SELECT  column_name(s),  
    FROM  table1 t1
    INNER  JOIN  table2 t2
    ON  t1.column_name = t2.column_name;

This will return combined table of having all the columns from two tables

LEFT JOIN

LEFT JOIN keyword is used to join two tables based on common columns
This will return all the rows from first table and records that match from the second table

    SELECT  column_name(s) 
    FROM  table1 t1  
    LEFT  JOIN  table2 t2
    ON  t1.column_name = t2.column_name;

RIGHT JOIN

RIGHT JOIN keyword is used to join two tables based on common columns
This will return all the rows from second table and records that match from the first table

    SELECT  column_name(s) 
    FROM  table1 t1  
    RIGHT  JOIN  table2 t2
    ON  t1.column_name = t2.column_name;

SELF JOIN

SELF JOIN keyword is used to join a table with itself by using a column which have common values of other column in same table

    SELECT
        e.Id,e.FullName,e.ManagerId,m.FullName as ManagerName
    FROM Employees e
    JOIN Employees m
    ON e.ManagerId = m.Id

This can be achieved by using alieses

Aggregations, Filters in queries

Aggrigators are functions that are perfomed on a column name depending on reqirement
Filters are the conditions that are used to filter required data

Aggregations

Some of the common aggregators are
- COUNT(colomn_name) :
  - returns the number of records in that column
  - It will not count NULL values
- SUM(column_name):
  - returns the sum of all the values in tha column
  - It ignores NULL values
- MIN(column_name):
  - returns the minimum value in the column
- MAX(column_name):
  - returns the maximum value in the column
- AVG(column_name):
  - returns the average value of column values
- STDDEV(column_name):
  - returns standard deviation of values of the given column
- CONCAT(value1,value2):
  - returns the concatinated string of given values #### example:

SELECT COUNT(student) FROM students;

The above statement returns the count of records in students table
similarly we can use different aggregator functions

Filters

Here are some of the filters
- = (equals) :
  - this operator used check if two values are equal or not
- != (not equals):
  - retruns true if two values are not equals else returns false
- > (greater than):
  - returns true if value1 is greater than value2, else returns false
- < (less than)
  - returns true if value1 is less than value2, else returns false
- NOT:
  - It will negates the boolean obtained
- LIKE :
  - It is key word can be used to search a pattern
- IN:
  - returns true if value is present inside set of values
- NOT IN :
  - returns true if value is not present in set of values
- IS NULL:
  - checkes if that value is null or not
- IS NOT NULL:
  - checks if that value is not null or not #### Example

SELECT * FROM students
WHERE marks > 90 AND 
name LIKE '%raj%' AND 
age NOT IN BETWEEN 10 AND 13

The above snippet gives the student recors whose marks are greater than 90 and name should contain 'raj' and age is not in between 10 and 13.
similarly we can use different filters to get required result

Normalization

Normalization refers to organising redundent data into tables such that no data redundency is present
There are majorly five stages of normalization
- First Normal Form (1NF):
  - single row should not have multiple values
  - tables can't be furture divided into smaller parts
- Second Normal Form(2NF):
  - This requires that all non-key attributes in a table are functionally dependent on the entire primary key, rather than just a part of it.
- Third Normal Form(3NF):
  - Non key attribute of any table should depend only on primary key not on any other key
Most of the present databases are in 3NF
There are other normalisation forms but not majorly used

Indexing

To improve the performence of a select query we use indexing
Indexing will create a pointer to the data where database is stored
Indexing should not be used if data manipulation is intense

Creating a Index

Basic syntax to create indexing

CREATE INDEX index_name ON table_name;

we can create unique indexes as well ### Drop a Index
If we want to remove indexing

DROP INDEX index_name;

Transactions

Transaction in sql is some set of instructions that we give to database to change data
Transactions follow ACID principles ## Transaction Control Commands
These commands can only be applied to the DML statements
They are INSERT, DELETE, and UPDATE only
here are transaction control commands
- COMMIT :
  - after DML statement, if we use commit statement changes will be saved permanantly to database.
  - It will update the database since last COMMIT or ROLLBACK
- ROLLBACK :
  - rollback command will undo the changes in the database that were made since last commit or last rollback
- SET SAVEPOINT:
  - we can create a savepoint upto where we want to save the statement
- RELEASE SAVEPOINT:
  - It will remove the savepoint from database
we can't rollback changes once they are commited

Locking Mechanism

Locking mechanism in sql helps to maintain isolation property which is one of the ACID principles
we use keyword USE LOCK to enable a lock to any data base resource i.e Tables,columns , rows, keys etc

Types of Locks:

1. Exclusive Lock (X):

The exclusive lock happens during a Data Manipulation Language (DML) operation such as INSERT, UPDATE, and DELETE query.
Once the lock is used we can't access the table till the process completes

2. Shared Lock(S):

This happpens during select statement
Updating a table during shared lock is not possible

3. Schema Lock (Sch):

We use schema locks when a transaction to create or alter a table (Data Definition Language statement) is used in the SQL Server database.

example:

    BEGIN TRAN

    USE LOCKS

    UPDATE employees
    SET title = 'Software Engineer II'
    WHERE emp_id = 101
    ROLLBACK;

Since we are updating a table Exclusive lock will be active till the transaction completes

Isolation Levels

Isolation levels define the degree to which a transaction must be isolated from the data modifications made by any other transaction in the database system.
The SQL standard defines four isolation levels:
- Read Uncommitted – Read Uncommitted is the lowest isolation level. In this level, one transaction may read not yet committed changes made by other transactions, thereby allowing dirty reads. At this level, transactions are not isolated from each other.
- Read Committed – This isolation level guarantees that any data read is committed at the moment it is read. Thus it does not allow dirty read. The transaction holds a read or write lock on the current row, and thus prevents other transactions from reading, updating, or deleting it.
- Repeatable Read – This is the most restrictive isolation level. The transaction holds read locks on all rows it references and writes locks on referenced rows for update and delete actions. Since other transactions cannot read, update or delete these rows, consequently it avoids non-repeatable read.
- Serializable – This is the highest isolation level. A serializable execution is guaranteed to be serializable. Serializable execution is defined to be an execution of operations in which concurrently executing transactions appears to be serially executing.

Triggers

Trigger is a set of instructions that we want to perform when ever a data manupulaiton happens on a table
Triggers can't be called manually, as they are run only after every DML transaction

Examlple

Creating a trigger

    CREATE  TRIGGER  schema.trigger_name
    ON table_name
    AFTER {INSERT, UPDATE, DELETE}
    [NOT  FOR REPLICATION]
    AS
    {SQL_Statements}

{SQL_Statements} will be exicuted when ever you to DML operations in above query

References

Objects and Object Oriented Programming

Yaswanth K N — Thu, 11 May 2023 06:15:02 +0000

What is an Object and Class:

Object can be any real life entity, that has some functionalities and attributes.
Class is a blueprint that provides the functionality to the object
- e.g: Car is a object which has functionalities like movement, transport etc.
- The Car comes under a class of Vehicles
- That means Vehicle will provide blueprint of functions that car has to perform

Principles of OOP:

OOP introduced as a representation of real world scenarios
It works majorly on four principles
- Inheritence
- Abstraction
- Polymorphism
- Encapsulation
Let's look at them one by one.

Inheritence:

Inheritence is a useful concept which helps us to reuse our code
There are three types of Inheritence in python
- Single Inheritence
- Multi-level Inheritence
- Multiple Inheritence

Single Inheritence:

Here There will be only one parent class, one child class.


class Animal:
'''Parent class'''
    def __init__(self,color,legs):
    ''' Constructor of parent class'''
        self.color = color
        self.legs = 4
    def sound(self):
    '''Instance method of parent class'''
        pass
class Dog(Animal):
    '''Dog class inheriting from Animal class'''
    def __init__(self,color,legs,sound):
        super().__init__(color,legs)
        self.sound = sound
    def sound(self):
        print(self.sound)
dog = Dog('black',4,'Boww')
dog.sound()

In the above example sound method was overrided in child class.
child class can access the methods of parent class
super key word is used to call the immediate parent class constructor

Multi-level Inheritence:

Here there will be chain of class that are inheriting.

class  Parent:  
    def  __init__(self,name): 
        self.name = name 

class  Child(Parent):  
    def  __init__(self,name,age): 
        Parent.__init__(self,name) 
        self.age = age

class  Grandchild(Child):  
    def  __init__(self,name,age,location): 
        Child.__init__(self,name,age) 
        self.location=location 

gc = Child('Yaswanth',22,'Andhra Pradesh')
print(gc.name(), gc.age(), gc.location())

In the above example, grandchild is inheriting attribute of parent class
child is ingeriting parent class attributes
Point to be noted is that, It's not Possible for parent class to access child class attributes or methods.

Multiple Inheritence

Python supports multiple inheritence.
It involves inheriting methods or attributes of two or more classes at same time

class A:
    def __init__(self):
        self.a = 'A class'
class B:
    def __init__(self):
        self.b = 'B class'
class C(A,B):
    def __init__(self):
        A.__init__()
        B.__init__()

c = C()
print(c.a , c.b)

Here we can access A, B attributes with c object.

Abstraction

Following use case is one of the useful case that i cam to know of Abstraction
Let's say when you are writing a class that has three methods, you know the implimentation of first two methods.
So we can impliment two methods and mention third method as abstract method so others can impliment the left out method by overriding it.
Abstract methods are declared in python by Importing ABC class from abc module as shown

from abc import ABC,abstractmethod
class A:
    def method_one(self):
        print('method one')
    def method_two(self):
        print('method two')
    @abstractmethod
    def method_three(self):
        pass
class B(A):
    def method_three(self):
        print('method three implimented')
b= B()
b.method_three()

Here method_three has been declared as a abstractmethod, so it has to be implimented to create object for B class

Polymorphism

ploymorphism means the existence in many forms
Overriding function comes under polymorphism
Operator overriding is an example of polymorphism

class A:
    def method_one(self):
        print('method from class A')
class B(A):
    def method_one(self):
        print('method from class B')
a=A()
a.method_one()
b=B()
b.method_one()

In the above example same method giving different result for different objects,hence polymorphism is achived

Encapsulation

Encapsulation refers to the scope of attributes and methods of class
In Python, this can be of three types
- Public
- Private (start with double underscore '__')
- Protected (start with single underscore '_')

class A:
    def __init__(self):
        self._a = 'A class protected attribute'
        self.__b = 'A class private attribute'
        self.c = 'A class public attribute'
class B(A):
    def __init__(self):
        super().__init__()
b=B()
print(b.c) # output : 'A class public attribute'
print(b._a) # output : 'A class protected attribute'
print(b.__b) # output :AttributeError: 'B' object has no attribute '__b'

In the above example, b.__b returned error because __b is a private attribute of class A
protected attributes can be accessed through inheritence
public attributes can be accessed any where Note: Same encapsulation applies for the methods also

References:

Strings in Python

Yaswanth K N — Thu, 11 May 2023 04:33:16 +0000

The Purpose of this paper is to get required idea of methods of String in python in simplified way
String is a collection of characters.
Strings are immutable in python that means we can not change values of string but to create new string.
we can access each character by their index

Methods:

string.strip()

This method will delete the trailing and leading spaces of string


    string = " yaswanth " #Notice there are spaces before and after the string

    name = string.strip()

    print(name) #output : 'yaswanth'

string.split()

This method is overloaded, if we don't give any arguments to split() it will split the string at spaces and returns the list of strings.

if we give argument to it, it will split the string at that character and returns list of strings
```
        string = " hellow world "

        ls = string.split()

        print(ls) #output ['hellow','world']

        string = string.strip()

        ls = string.split('o)

        print(ls) #output ['hell','w w','rld']
```

string.lower()

It will convert the every alphabet in string to lower case

        string = 'YASWANTH'

        lower_case = string.lower()

        print(lower_case) #output 'yaswanth'

string.upper()

It will convert the every alphabet in string to upper case

        string = 'yaswanth'

        upper_case = string.upper()

        print(lower_case) #output 'YASWANTH'

string.isdigit()

It will return a boolean value, if entire string is number returns true, else returns false.

        string = '12345'

        print(string.isdigit()) #prints True

        string = ' 12345 ' #Notice there a space in front and back of string

        print(string.isdigit()) #prints False

string.isupper()

This will return true if all the alphabets of string are upper case else it will return false


        string = 'HELLO WORLD'

        print(string.isupper()) #prints TRUE

        string = 'Hello world'

        print(string.isupper()) #prints FALSE

string.islower()

This will return true if all the alphabets of string are lower case else it will return false


        string = 'HELLO WORLD'

        print(string.isupper()) #prints FALSE

        string = 'hello world'

        print(string.isupper()) #prints TRUE

string.join(iterable)

This function takes the iterable as a argument

This will join string to each item in the iterable and returns string
```
        string = 'hello'

        string = ' '.join(string)

        print(string) # prints 'h e l l o ' as output
```

string.startswith('object')

This function returns True if string starts with given object else returns False



        string = 'hello, I am Yaswanth'

        print(string.startswith('hello')) #returns True

string.index('object')

This function returns the start index of object in string

        string = 'hey! There'     
        print(string.index('There')) #returns 5

string.isalpha()

This function retuns boolean value. it will return True if all characters in string are alphabets else returns false.

        string = 'hello'

        print(string.isalpha()) #returns True

        string = '1 hello 2'

        print(string.isalpha()) #retuns False

string.format(arg1,arg2..)

This function is used to format a string by sending arguments to string which are not necessorly strings.

Although we have string literal to do this work now it's always good to know legacy code
```
        name = 'yaswanth'

        age = 21

        print('my name is {}, my age is {}'.format(name,age))

        # prints 'my name is yaswanth, my age is 22'
```

References:

Lists in Python

Yaswanth K N — Thu, 11 May 2023 04:23:55 +0000

The Purpose of this paper is to get required idea of methods of list in python in simplified way
List is a ordered collection of variables
lists can be non homogeneous

Methods:

`ls.append('object')`

This appends the object at end of list


       ls.append('object') #Object will be added to list at the end

ls.clear()

clears the entire list and makes it empty
```
    ls.clear() # clears the entire list
```

`ls.index()`

It will through error if object is not in list


    ls.index('object') #return the index value of 'object'

`ls.count(arg)`

It will return Zero if element is not found in list


    freq = ls.count('objrct') # It will return the frequency of That Object in the list

ls.pop()

This function removes last item of list and returns the item
```
    ls.pop() #Removes the last item of the list
```

`ls.insert(index , 'object')`


    ls.insert(index, 'object') #inserts object at given index

ls.sort()

This function returns None and sorts the data inside list

This will not work for non-homogeneous lists
```
    ls.sort() #sorts the items in Ascending order
```
ls.reverse()

This function returns None and reverses the items inside list
```
    ls.reverse()
```
ls.extend()

This function takes the iterable as argument and adds each item to the last
```
    ls = []

    ls.extend('iterable') # returns [i,t,e,r,a,b,l,e]
```
ls.copy()

This function creates a copy of list
```
    ls = old_list.copy()
```
ls.remove()

This Function takes the object inside the list as argument and removes it from the list

If the Object is not present in list it will through error saying 'Object not list'
```
   ls.remove(5) #it will remove 5 from list
```
List as Stack

list in python can be used as a stack, since it has both the methods .append() and .pop().

ls = []
#append
ls.append('a')
ls.append('b)
#pop
ls.pop() 
ls.pop()

References:

Dictionary in Python

Yaswanth K N — Wed, 10 May 2023 17:23:40 +0000

Dictionary is a data structure in python where data is stored as a key:value pair.
Python dictionary is a ordered data structure since Python 3.7 i.e it will remember the order of insertion.
Python dictionaries are mutable, we can change the value of a given key at any point of time.
Dictionaries do not allow duplicate keys, since it uses hashing concept to store keys.
Getting a value using key is a constant time operation O(1)

Dictionary Methods

Given most of the commonly used in built methods in python. Note: The given methods are performed on the below dictionary

dictionary = dict() #declaring a dictionary

Inserting Key:Value pairs

we don't have any exclisve function to do the job but we have a specific sintax to do it, as shown below,

 dictionary['name'] = 'milk'
 dictionary['color'] = 'white'
 dictionary['source']  = 'cow'
 print(dictionary) 
 # output  :  { 'name' : 'milk', 'color' : 'white', 'source' : 'cow' }

Accessing a Value using Key
- There are two ways you can access a value using key
- In python, there is a method .get() which takes a key as a argument, used to get a value as shown
- .get() will return None , if key is not found in a dictionary
```
    value = dictionary.get('name')
    print(value)
    #output: 'milk'
    value = dictionary.get('unknown_key')
    print(value)
    #output : None
```

The other way to access a value is using square brackets, the major difference between two methods is that it will through error if key is not found in dictionary.
```
    name = dictionary['name']
    print(name)
    #output: 'milk'
    name = dictionary['unknown_key]
    #output : KeyError: 'unknown_key'
```

Methods used while looping a Dictionary

`.items()` :

This method generates dict_items which are tuples of key,value pairs. we can use tuple unpacking technique to access the key and values as shown.

    items = dictionary.items()
    for key,value in items:
            print(key , value)
    #output: name milk
             color white
             source cow

`.keys()`:

This method will return dict_keys which are list of keys in a dictionary. we can use loops to access all the keys.

    keys = dictionary.keys()
    for key in keys:
        print(key)
    #output: name
             color
             source

`.values()`:

This method will return dict_values which are list of values in a dictionary. we can use loops to access all the values.

    keys = dictionary.values()
    for value in values:
        print(value)
    #output: 'milk'
             'white'
              'cow'

`in`:

It is a keyword which can be used to find weather the key is present or not
it will return a boolean value as shown

    boolean = 'name' in dictionary
    print(boolean)
    #output: True
    boolean = 'unknown_key' in dictionary
    print(boolean)
    #output: False

`.update()`:

This will take another dictionary as argument and addes it to the old one

    new_dict = { 'food' : 'grass' }
    dictionary.update(new_dict)
    print(dictionary)
    #output: {'name': 'milk', 'color': 'white', 'source': 'cow', 'food': 'grass'}

`.copy()`:

This method copies the entire dictionary to the new one

     new_dict = dictionary.copy()
     print(new_dict)
     #output: {'name': 'milk', 'color': 'white', 'source': 'cow', 'food': 'grass'}

Update using Square Brackets

We can append a key value pair in to a dictionary or we can update a value using the key as shown.

    dictionary['source'] = 'buffelo'
    dictionary['year'] = '2015'
    print(dictionary)
    #output: {'name': 'milk', 'color': 'white', 'source': 'buffelo', 'food': 'grass'      'year': '2015'}

.pop('key'):
- This method will take key as a argument and will remove the key value pair from dictionary as shown
- It will return a value of the key that was poped
- This will through KeyError if key is not found
```
    print(dictionary.pop('food'))
    #output: 'grass'
    print(dictionary.pop('unknown_key'))
    #output: unknown_key : 'unknown_key'
```
.popitem():
- This method will pop the last item that was inserted and will return a tuple of key and value
- This will return KeyError if dictionary is empty
```
    print(dictionary.popitem())
    #output:('year', '2015')
```

`.clear()`:

This method will clear the dictionary and returns None

    dictionary.clear() 
    print(dictionary)
    #output: {}

defaultdict:
- This function can be imported from collections module in python
- this will take a customized function reference as input, when ever tha key is not present in dictionary it will exicute the custom function.
```
    from collections import defaultdict

    def default_fun():
        print('key is not present')

    dct = defaultdict(default_fun)
    print(dct['unknown_key'])
    #output: key is not present
```

Forem: Yaswanth K N

Django FrameWork

Secret Key :

Default Django Apps

CSRF

XSS

Click Jacking

Middleware

WSGI

Models

Foreign Key

Fields and Validators

Django ORM

Asynchronous JavaScript

CallBacks

Promises

Code Control

References

JavaScript

Loops:

for:

forEach:

for .. in:

for .. of:

while :

Mutable vs Immutable

Pass by Reference and Pass by Value

Array Methods

Array.pop():

Array.push():

Array.concat():

Array.slice()

Array.splice()

Array.join()

Array.flat():

Finding:

Arrays.find():

Arrays.indexOf():

Array.includes():

Arrays.findIndex():

Higher Order Functions

Arrays.forEach():

Array.map():

Array.filter():

Arrays.reduce():

Arrays.sort():

Array methods chaining

String Methods

string.charAt():

string.concat():

string.length:

string.toUpperCase():

string.toLowerCase():

string.split():

string.substring():

Object Methods

Assigning:

Checking:

Object.keys():

Object.values():

delete object[key]:

Object.entries():

Hoisting

Scopes

Closures

Debugging

References

HTML - CSS

Box Model

Inline Elements vs Block Elements

Positioning: Absolute and Relative

Common CSS Structural Classes

Common CSS Styling Classes

CSS Specificity

CSS Media Queires

FlexBox / Grid

CSS Meta Tags

References

SOLID Principles

Single Responsibility Principle

`for`:

`forEach`:

`for .. in`:

`for .. of`:

`while` :

`Array.pop()`:

`Array.push()`:

`Array.concat()`:

`Array.slice()`

`Array.splice()`

`Array.join()`

`Array.flat()`:

`Arrays.find()`:

`Arrays.indexOf()`:

`Array.includes()`:

`Arrays.findIndex()`:

`Arrays.forEach()`:

`Array.map()`:

`Array.filter()`:

`Arrays.reduce()`:

`Arrays.sort()`:

`string.charAt()`:

`string.concat()`:

`string.length`:

`string.toUpperCase()`:

`string.toLowerCase()`:

`string.split()`:

`string.substring()`:

`Object.keys()`:

`Object.values()`:

`delete object[key]`:

`Object.entries()`:

`ls.append('object')`

`ls.clear()`

`ls.index()`

`ls.count(arg)`

`ls.pop()`