Forem: Soujanya Satpute

Matplotlib - Brief

Soujanya Satpute — Tue, 14 Jun 2022 17:32:30 +0000

Plotting Normal Graph

pyplot.plot() function: If you call plot() one after another, Next graph will be printed on same graph window.

plt.plot(x_axis_column, y_axis_column)
plt.show()

Labeling Graph Label gives different names to Graph as we wanted it. Legend: Area that describe graph elements. This function have attributes for styling and locating legend on graph screen

plt.plot(x_axis_column, y_axis_column, label='Label Name')
plt.title('Title of Graph')
plt.ylabel('Ylabel')
plt.xlabel('Ylabel')
plt.legend()
plt.show()

.text() for adding text Annotation to graph: Main Documentation for further details

plt.text(xPosition,yPosition,'Text')

Be careful while putting positional co-ordinates. Don't set it out of range.

Styling Graph: In .plt.plot() we have attributes like color,linestyle, marker. There are multiple default styles provided by matplotlib to try on to your graphs.

Plotting Scatter Plot

Only change from .plot to .scatter And Styling can be applied same as normal Graph

plt.scatter(x_axis_column, y_axis_column, color = 'red')

You can add Crazy styling with different Background image. Resource here

Plotting Bar Graph

Can you guess how to do that?
plt.bar()? Yes Exactly!

plt.bar(x_axis_column, y_axis_column)

Plotting histogram

First Question: What's difference between Bar graph and histogram?
Histogram: display the frequency of numerical data, It means in given column of database what is the frequency of particular number.
It contains non-discrete values.
Bar graph: compare different categories of data. discrete values can work.
Much clear difference here
Now Actual Plotting:

plt.hist(column_data_for_histogram, bins=50, range = (5,35))

Changing Value of bins
Bins are number of columns or towers in the histogram. Default value of these bins is 10. We can modify in the code.
Defining Range of histogram
Manually selecting range for histogram for where to start and end.

Pandas - Brief

Soujanya Satpute — Tue, 14 Jun 2022 16:42:02 +0000

What is pandas?
Pandas is python package built on two python packages Matplotlib and Numpy.
14 million users

DataFrame: 2 dimensional, Mutable, heterogeneous(Can be),Tabular Data structure

.info() Method: Generates Summary of the dataFrame with column names, Non-null counts, Dtype, memory Usage.
.head() Method: returns the first few rows (the “head” of the DataFrame).
.describe() Method: use for calculating statistical properties like mean, max, std Deviation, percentiles
.values Returns Numpy representation of the dataFrame. But new method that is to_numpy() should be used rather than .values.
.columns List all column heading for database and its data types.
.index
List all index in the dataFrame. These index means numbers of rows
.shape Function:
Returns the tuple of shape such as rows and columns
.size Function:
Returns overall number of elements in that data frame
.ndim Function:
Returns dimensions of Database
DataFrame column selecting
You can select also multiple columns in database by double square bracket syntax. First square bracket is for syntax of dataFrame selection and second is for List of columns.

column1 = dataFrame['columnName']
column1 = dataFrame.columnName
column1 = dataFrame[['columnName', 'col2']]

DataFrame row selecting with logical testing
And or Operators in row selection
Specific Value row selection: This selects particular row from given column where value is value. We can use different logical operator here also

row1 = dataFrame.[dataFrame.column == 'Value']
row1 = dataFrame.[dataFrame[column]== 'Value']

Sorting Dataframe:

sortedDataFrame = dataFrame.sort_values('column_to_sort')
sortedDataFrame = dataFrame.sort_values(by = ['column_to_sort1', 'column_to_sort2'])

Sorting can be perform on numbers, Dates.
Extra Attributes -
ascending = True / False,
na_position = first/ last - where to put Nan Values.
Example:

homelessness_reg_fam = homelessness.sort_values(['region','family_members'],ascending=[True,False])

isin() Method: isin() is used in filtering DataFrame. With Particular Value and particular column.

# The Mojave Desert states
canu = ["California", "Arizona", "Nevada", "Utah"]

# Filter for rows in the Mojave Desert states
mojave_homelessness = homelessness[homelessness.state.isin(canu)]

Adding New Column to Database: Terms for adding new columns: Mutating/transforming DataFrame or feature engineering

dataframe['new_column'] = old_column.some_transformation

Summary Statistics Summary statistics is the way you can summarise and know more about your data. mean(), median(),mode(),min(),max(),var(), std(), sum(), quantile(), agg(), agg() method is use to calculate custom summary statistic. agg() function takes more than one parameter function in the form of list. Example of custom percentile is as follows.

def percentile30(column):
   return column.quantile(0.4)

dataFrame[columnName].agg(percentile30)

Functions like min,max works on Date columns also.

Calculating Cumulative Statistics
cumsum(), cummax(),cummin(),cumprod()

To be Continued...

Web Designer Guide and Tips

Soujanya Satpute — Fri, 03 Jun 2022 10:04:51 +0000

Note: This is updating article.

Sketching
Inspiration
Userflow
Sitemap
Wireframes
Prototyping
Feedback

Visual Design

Spacing and Grid
Typography
Color
Visual Assets Designing Images with whole background and generally whole screen width. Positioning on screen is much harder if you have small images. There for have image format and just adjust image css - source Udemy Case Study.

Design System

Design Patters
Microinteraction
Motion

Code improvement tips

Soujanya Satpute — Thu, 26 May 2022 17:03:21 +0000

How to name function?

// For showing loading spinner
function loading(){
loader.hidden = false
}

// Even Comments are not necessary
function showLoadingSpinner(){
loader.hidden = false
}

Name the function with particular action.

Recursive Function can lead you in infinite loop of errors

function getdatafromAPI(){
try{
//Function
throw new Error('OOps')
}catch(error){
getdatafromAPI()
}
}

Can you Imagine what will happen in here?
Solution: Setting some counter variable in catch block so you can run function certain number of times and if it stills shows error define error.

Increasing performance of website when network is slow, by shipping only things that are necessary for the view. Creating initial_load boolean to and make first loading setting it false for all other loads and make initial loading fast. The less data you ship faster your website will be.
Check out TC39/proposals for staying upto date with new feature of Js.
Creating different modules whenever it is possible to make your code clean.
Check the order of your javascript importing in the html files. Those really matters.
Different Ways of importing javascript
async - Only on packages whose execution order doesn't matter.
Something like google analytics script
defer - only execute the script after loading everything
Javascript is the reaction of data change on webpage
And frontend framework like react and angular helps writing those reaction cleaner and faster
Difference between textcotent and innertext of html from javascript
Innertext triggers rendering of whole page even if the inside content is not changed that can be computationally expensive
Don't declare variable of type function and then change it to variable not good practice
Choosing which data type to use Array or object?
While using Array if you want to delete element through an array you need to go through entire array but for object you can do that with simple key and the process become faster.
Checking user browser to implement some features is cumbersome because browsers are always updating something into them. You can check type of browser in windows.navigator.userAgent but you get multiple browser options there.
So always right browser specific code in conditionals.
Concept of Models in javascript:
For module you can put files in any order and it will still works. If you just add script file as it is then order does matter. For modules Order doesn't matter.
Module is one single entry file in the javascript that is connected to other files.
Web bundlers:
Bundlers are the software that understand the what part of code is used and creates efficient bundle for import. It works on concept of tree shaking and eliminates code that we are not using.
Dynamic Module loading:

import('./modules/myModule.js')
  .then((module) => {
    // Do something with the module.
  });

When give display: flex; attribute hidden in html doesn't work. you have to add different class to hide Attribute and then make display none over it.

Introduction to deep learning in Python - Basics

Soujanya Satpute — Wed, 11 May 2022 14:10:33 +0000

Deep learning teaches computers to do what comes naturally to humans: learn by examples. It captures complex patterns in the given examples; finds interactions between them, which lead to predicting the desired output.

Capturing interactions

Suppose you have to predict a number of transactions using factors like Age, bank balance, Retirement status, etc.

You can use linear regression here. Linear regression is when you fit Data on the straight line to find the prediction.

But something is missing! It seems unrealistic to think that all data variables are independent of others. See the parallel line? There is no interaction between them.
This is where Neurons come into the picture. Multiple Neurons stack on each other to find interactions in given input data(Neural Network). Something like these.

Neurons are like a black box with some magic inside it. When data is sent through it the first time, It uses its magic to predict something.
First-time, the magic fails. But as neuron predicts more things, they get good at this witchcraft. And the dystopia is here; they can and will replace you in the Job market.

With complex enough neural network and correct resources of data and time, you can literally capture any intricate interaction between any data points.

Any neural network starts with the input layer and ends on the output layer. And the magic happens in the hidden layers. And they are hidden for now; as you go deep into deep learning, you will find them.

The most complex neural network is GPT-3. It captures 175 billion interactions. Let's start with a single one.

Forward Propagation

Now let's understand magic!

Now let's understand magic!
The forward-propagation algorithm will pass this information through the network to predict the output.
Each neuron has a real value linked to it which tells the importance of that neuron feature in predicting the output. These are weights. Weights will predict output for next layer.

Output calculation algorithms:

for all connections to the node: 
     Node_value += input * weights

Python code for doing same calculation for neural network in given image

import numpy as np
input_data = np.array([2,3])
weights = {'node_0':np.array([1,1]),
'node_1':np.array([-1,1]), 
'output':np.array([2,-1]) 
}
node_0_value = (input_data* weights['node_0']).sum()
node_0_output = np.tanh(node_0_value)
node_1_value = (input_data* weights['node_1']).sum()
node_1_output = np.tanh(node_1_value)

hidden_layer_value = np.array([node_0_output,node_1_output])
output = (hidden_layer_value*weights['output']).sum()

Coding journey Begins here

Soujanya Satpute — Mon, 25 Apr 2022 16:15:36 +0000

It starts with just hello world!
Then you sit with your first code, and something doesn't work. You sit there for hours. If you are lucky, you can make it work in minutes, or debugging is your full-time job.
I wanted to be a developer. And I want to be in the top 1% of it. But I am Gen Z, born when insecurity and self-doubts were humping on their best day. Sorry, mom and dad. It's nothing about you!
So I decide I want to be the best at coding. I want to give dedicated time to it daily. 2 hours maybe! I want to commit at least 10 requests on GitHub daily for the next 6 months. And the journey begins.
I did some online courses, But still, I am not good enough. As a developer, I am only good at copying and pasting code from one place to another, and nothing more than that; this was my self-talk.
But for the first time in my life, I was enjoying the process of debugging most of my stupid mistakes. I was enjoying it to my knuckles and bones.

Then came the perfectionist monster from my brain, pushing me into the valley of darkness. And to be honest, my brain loves living there in the perfect world. I wasn't finishing my portfolio project, a stepping stone if you want to apply for jobs. Not because I can't do it, but because it will be all real. And I am the imposter who's not good enough.
But I want to finish that portfolio. I want to make a list of projects that I can put on it, and I want to apply for zestful jobs that will give me the thrill of jumping through airplanes.
I am giving myself a timeline here. In the next 2 days, I want to create the final version of the portfolio that I can put on my resume. And I will be documenting this with Dev Community here weekly.
The gist of a good programmer is to create enough distance between you and your brain. To make the best products. And I want to learn how to do that.