DEV Community: Manar Imad

Models' Relationship In Django

Manar Imad — Sat, 25 Sep 2021 23:26:16 +0000

Hello BackEnders

Today, I decided to explain OneToOne , ManyToMany , and Foreignkey in Django

So let's get started:

Why do we use relationships?

The first step to understand the relationships is to understand why we need them. Let's not talk too much about the concept of "Normalization", imagine if we have a table with students names, gender, and school events :

StudentID	StudentName	StudentGender	StudentsClass	StudentDesk	SchoolEvents
1	Natchos	Male	4A	321	Zoo Visit, Charity Day
2	Manar	Female	5A	40	Charity Day
3	Kareem	Male	4A	66	Zoo Visits , Math Competition

you can notice here that every student has a desk "represented with a number" but why do we have this data in this table? Also, "Male" in StudentGender and "4A" in StudentsClass has been repeated twice in the table. And the worst is in the SchoolEvents column. Just think if we want to delete the Zoo Visit from Natchos's ongoing events, the Charity Day will be deleted too!
Imagine if we have 100 or 1000 students!

Instead, we have to divide the table into smaller tables "four tables in our case"

StudentID	StudentName
1	Natchos
2	Manar
3	Kareem

ID	StudentGender
1	Male
2	Female

ID	StudentsClass
1	4A
2	5A

ID	Events
1	Zoo Visit
2	Charity Day
3	Math Competition

Perfect. But what is next? We need a way "a link" to tell the database that this particular student is in this class, has this gender and will go to these events.
That is what we do with relationships. A relationship is an association between two entities.

Foreignkey:

I started with Foreignkey because it is the easiest to understand.

Foreignkey in Django represents "one to many" also called "many to one" relationship in the database.
it is just the same as its name one to many! I have one mother and my mother has many children. The country has many cities and every city is located in one country.
In our example above, every student "normally" should have one gender. and every gender is for many students.
Natchos and Kareem are two students "many", Male is one.

Represent Foreignkey in Django:

Because we can not represent all the "many" in the "one" table. It makes a lot of sense to represent the repationship from the many sides.. which means in our example we can't go to the Gender table add a row and say in it: we have a relationship with Natchos , and Kareem and John and Tom ..etc in the male row "record" .. instead we can add a row in the student row and called gender that says these students a relationship with the Gender table in "Male" or in "Female".

Now to represent the ForeignKey will add it in the Student Field with one main parameter: referring to the model that has ForeignKey relationship "many to one" with it.

from django.db import models

class StudentGender(models.Model):
    gender = models.CharField(max_length=10)
class Student(models.Model):
    name = models.CharField(max_length=30)
    gender = models.ForeignKey(StudentGender, 
   null=True)

Notice in class Student :

gender = models.ForeignKey(Gender, 
   on_delete=models.CASCADE)

That in Django we don't refer to the id of the other model but for the model "class" itself ( in other frameworks such as Flask, we refer to the other model's id). Also, we used null=True to allow the nulls so we can have some students with no gender specified.

OneToOne

one to one is as easy as you can think. this pen is mine and this pen has one owner. I have one husband and my husband has one wife. In our example, every student setting on one desk and every desk is for one student "at least in my country"

Represent OneToOne in Django:

At this point and because we are going to add one value in either table, it doesn't matter where we add it. But because I think that it is a good idea to add in the Chair table since that the student is the main character, I will add the OneToOne field to the Chair :

class StudentGender(models.Model):
    gender = models.CharField(max_length=10)
    Student = models.OneToOneField(Student, 
   null=True)
class Student(models.Model):
    name = models.CharField(max_length=30)
    gender = models.ForeignKey(StudentGender, 
   null=True)

Notice in class Student :

gender = models.ForeignKey(StudentGender, 
   null=True)

Notice that here I also used "null=True" because as you know, if a chair has no student to set on, we don't have to throw it from the window.

ManyToMany

Students enroll in many courses and every course is enrolled by many students. in our example, each student can attend many events and every event will be attended by many students. This is simply what a many to many relationships is.

Represent ManyToMany in Django:

In ForeignKey we chose the "one" table and in OneToOne we chose either one. so what table can we choose in many to many? In the normal cases, we create a third table "more like a third wheel in the relationship" that has the id of the first table and the id of the second table as below:

But!

Django made it easier for us. it is just as easy as adding ManyToOne or foreignKey!Again I will not choose the student.

class Student(models.Model):
    name = models.CharField(max_length=30)
    gender = models.ForeignKey(StudentGender, 
   null=True)

class Chair(models.Model):

chair_number = models.IntegerField()
student = models.ManyToManyField('student')

Here, It seems we have reached the end.
Happy day to you and happy birthday to ME 🎂

References:

Applying Confusion Matrix In Real-Life Scenario

Manar Imad — Tue, 31 Aug 2021 11:41:35 +0000

Hello Scientist

Before we start, this article is a follow-up to the previous one about (Sets) in Math and Python.

To understand today’s post you should have knowledge of Sets or you can go and read What Is Set In Math And Python
Ok? Are you ready??

Then let’s get started.

Our first example is detecting Corona on People.

Let's call all the people that we chose as a test sample -> X
And the set of people among X who are sick (have Corona) -> S
The set of people among X who are Healthy(don't have Corona) -> H

To represent S in mathematics we write:

S={x ∈ X: x has Corona}

The small x means one of the X sets (a member of X).
So the formula says an x "a person from the sample test" that is a member of the X "the set of all the people of the sample test" and that x "that person" has Corona (from the S sub set).

And to represent H in mathematics we write:

H={x ∈ X: x doesn't have Corona}

Now, what is the possibility that one of the X people has Corona and doesn't have Corona at the same time?
Of course, this is impossible!

So we know that |S| ∩ |H| = ∅ and |S| ∪ |H| = X (the people in the test sample are either sick or healthy so if we put all the sick and healthy people together they will be all of our samples)

Now let's add our Corona detect prediction as we want to know how accurate is our CPR prediction.

So let the people from the sample who tested positive ->P And we represent them as P= {x ∈ X : x positive for Corona}

Note that positive here means that the CPR predicts that someone has Corona.

The people from the sample who tested negative ->N And we represent them as N= {x ∈ X : x negative for Corona}

Now we have 4 probabilities:

someone who has Corona and his test for Corona is positive.
someone who does not have Corona and his test for Corona is negative.
someone who has Corona but his test for Corona is negative.
someone who does not have Corona but his test for Corona is positive.

these probabilities are called the Confusion matrix

Confusion Matrix:

A confusion matrix is a technique for summarizing the performance of a classification algorithm.

Calculating a confusion matrix can give you a better idea of what your classification model is getting right and what types of errors it is making.

Now Let's discuss the 4 possibility:

Someone who has Corona and his test for Corona is positive.

The representation of this possibility is: |S| ∩ |P|
because S is the people who have Corona and P are the people who tested positive.
someone who has Corona and tested positive means we want to find someone in both sets (S and P) which means the intersection.

If we have a girl called Sara, Sara is in the P set which means the CPR predicted that Sara is in the S set ( the set of sick people)
If Sara is tested positive we call this prediction "positive" and if she is sick "if she is in S set" then we say the prediction is True -> True Positive.

When the prediction of what we are trying to find is right we call it positive.
When the reality meets the prediction we call it True So |S| ∩ |P| = True Positive.

someone who does not have Corona and his test for Corona is negative.

The representation of this possibility is: |H| ∩ |N|
because H is the healthy people who don't have Corona and N are the people who tested negative.
someone who doesn't have Corona and tested negative means we want to find someone in both sets (H and N) which means the intersection.

Let's assume that the girl called Sara is in the N set which means the CPR predicted that Sara is in the H set ( the set of healthy people)
If Sara is tested negative we call this prediction "negative" and if she is sick "if she is in S set" then we say the prediction is True -> True negative.

When the prediction of what we are , not trying to find (or the opposite of what we want to predict) is right we call it negative. -When the reality meets the prediction we call it True

So |H| ∩ |N| = True Negative

Someone who has Corona but his test for Corona is negative.

The representation of this possibility is: |S| ∩ |N|
because S is the sick people who do have Corona and N are the people who tested negative.

Let's assume that the girl called Sara is in the N set which means the CPR predicted that Sara is in the H set ( the set of healthy people)
If Sara is tested negative we call this prediction "negative" and because she is sick and not healthy "she is in S set" then we say the prediction is False -> False-negative.

When the prediction of what we are , not trying to find (or the opposite of what we want to predict) is right we call it negative.
When the reality does not match the prediction we call it False

So |H| ∩ |N| = False Negative

someone who does not have Corona but his test for Corona is positive.

The representation of this possibility is: |H| ∩ |P|
because H are the healthy people who don't have Corona and P are the people who tested positive.

Again, the poor Sara is in the P set which means the CPR predicted that Sara is in the N set ( the set of sick people)
If Sara is tested positive we call this prediction "positive" and because she is healthy "she is in H set" and not sick then we say the prediction is False -> False positive.

When the prediction of what we are trying to find is right we call it positive.
When the reality does not match the prediction we call it False

So |H| ∩ |P| = False positive

Note that to make our prediction accurate we want to increase the True positive and True negative and decrease the False-positive and the False-negative.

I know that it is a bit of a headache so here is another example you can think of:

we are making an app with machine learning algorithms that predict if a word is a bad - nasty word.

Again the word would be either bad word or not bad word and

Because we are searching for bad words, if we predict one we call the prediction positive, and if we predict the opposite "not bad" we call the production negative.

If our prediction is True then we call the prediction True, and if our prediction is False then we call the production False.

our sample X is the words in a sentence.
G is the set of not bad words. -> G= {x ∈ X: X is not a bad word}.
B is the set of bad words. -> B= {x ∈ X: X is a bad word}.
P is for the probability of bad words -> P= {x ∈ X: positive for bad words}.
P is for the probability of not bad words -> P= {x ∈ X: negative for bad words}.

Then:

|B| ∩ |P|= True Positive
|B| ∩ |N|= False Negative
|G| ∩ |P|= False Positive
|G| ∩ |N|= True Negative

Bonus 🥳:

Let's represent the Confusion Matrix

References:

What Is Set In Math

Manar Imad — Mon, 30 Aug 2021 20:34:21 +0000

Hello Scientists

Recently I was applying for data science positions. At many interview and technical exams, you will be asked about some math basics that are important for any data Scientist. So today let's study math! What is Set , cardinality , intersection , and union, then, we will talk about confusion matrix

Let's get started:

What is a Set

Set is a collection of things, set is made up of elements.

Set can be a group of similar or different things. For example, you can have a set of books or a set of random things in a box.

let's look at some symbols that are commonly used with sets

{} -> The representation of set (In Python this is a dict but we will use it)
∈ -> Membership/ Element of a set
∉ -> not element of/ no set membership
∅ -> Empty set (Phi)
∪ -> Union
∩ -> Intersection

Now let's take examples to understand the set and the symbols:

If we have a set of students of a math course and their names are : Manar, Noor, Raneem, Noura.

Then, to represent that set we write :

math_students = {Manar, Noor, Raneem, Noura}

Set representation in Python :

math_students = {'Manar', 'Noor', 'Raneem', 'Noura'}

Note that sets in Python can be from different types, such as :

my_set = {'A',4,True,5.78}

And Set items in Python are unordered, unchangeable, and do not allow duplicate values.

How many students above applied for the math course ?

The answer is 4. To represent it mathematically we use the word
" cardinality" which just means the size of the set. So, the cardinality of math_students is 4 and that's how we represent it:

|math_students| = 4

To find the cardinality in Python we write:

cardinality = len(math_students)

Note that the name cardinality here is just an example of a variable name

Now what is the relationship between Noura and math_students?

Noura is a member of the math_students
we represent it using ∈ like the way below :
Noura ∈ math_students

To check if there is a membership relationship in Python :

membership = "Noura" in math_students

Note that the name membership here is just an example of a variable name

What is the relationship between Dario and math_students ?

Dario is not a member of the math students set. That's how we represent it:

Dario ∉ math_students

To check the if there is no membership relationship in Python :

no_membership = "Dario" not in math_students

Note that the name no_membership here is just an example of a variable name

Now we have another set failed_students for the students who failed in the exam, but fortunately, no student has fail. So our new set is empty. To represent our empty set we write:

failed_students = ∅

In Python, the empty set looks like :

failed_students = {}

And its cardinality equal to zero :

print(len(failed_students))

output : 0

Now we reached the fun Part (Intersection and Union):

And we will start with intersection:

back to our math_class example, let's assume that we have another course which is Python, and the students who applied for the class are Manar, Tala, Dario, Raneem, Aseel
So now we have :

math_students = {Manar, Tala, Raneem, Noura}

Python_students = {Manar, Noor, Dario, Raneem, Aseel}

If you check the students' name (assuming that they are the same people),we will find out that Manar and Raneem are attending both math and Python classes

So we say the intersection between math_students and Python_students are Manar and Raneem .. To represent it mathematically:

math_students ∩ Python_students = {Manar, Raneem}

Note that the result of the intersection is a set

In Python, we represent the intersection using & symbol :

math_students & Python_students

output: {'Manar','Raneem'}

Let's imagine that we have another course for Geography, and the students are : Mark, Kitty, Tala and Keven

geography_studen = {Mark, Kitty, Tala, Keven}

What is the intersection between geography_studen and python_students ?
Well, the answer is: there is no intersection
And What did we say about how to represent an empty set ? by using Phi ∅ . So:

geography_studen ∩ python_students = ∅

And in Python :

geography_studen & python_students

output: set()

Now the Union
We have :

math_students = {Manar, Tala, Raneem, Noura}

Python_students = {Manar, Noor, Dario, Raneem, Aseel}

The union is all the members of all the sets
which means here, all the members of math_students and all the members of Python_students.

To represent the Union we said that we will use ∪.
So, let's try to put them together :
math_students ∪ Python_students = {Manar, Tala, Raneem, Noura, Manar, Noor, Dario, Raneem, Aseel}

Ok that seems good but as we can notice, Manar and Raneem are duplicated, Why ? because Manar and Raneem are attending both the math and Python courses. in other words, because Manar and Raneem are the intersection between math_students and Python_students. So let's remove one Manar and one Raneem

math_students ∪ Python_students = {Manar, Tala, Raneem, Noura, Noor, Dario, Aseel}

Now Our Union is correct. What we just did is something called Inculsion Exclusions Formula.
The mathematical representation of the formula is:

|A ∪ B| = |A| + |B| - |A ∩ B|

And that's what we did. we added Python_students and math_students then we minus the interaction (remove the duplication)

To represent union in Python:

Python_students | math_students

output: {'Manar', 'Tala', 'Raneem', 'Noura', 'Noor', 'Dario', 'Aseel'}

And that's it for the symbols 😀

Bonus Info 🥳: What Is Venn Diagram?

Venn Diagram:

Is illustration the uses circles to show the relationship among infinites groups of things.

For Example:

A= {1,3,5,7} B= {2,3,4,5,6} C= {9,15}

Finally, we reached the end. Hope you Enjoyed

References

Reasons To Use Recursion and How It Works

Manar Imad — Fri, 27 Aug 2021 17:04:19 +0000

Hello Engineers

Today, I will talk about recursion in what, why, and how.
What is recursion , why to use it, and how to solve problems with it.
The examples will be in Python since Python is easy to understand and close to the algorithms ..

Shall we start ?

What is recursion?

A more complex definition of recursion is: a technique that solve a problem by solving a smaller problems of the same type . We can simplify the definition by saying that recursion is a function that calls itself directly or indirectly. Don't worry for now, it will be much clearer when we start writing our examples.

Why to use recursion?

I choose this question over "when to use recursion" because many learners who studied recursion wanted to know why to use it since that all the problems we can solve in recursion , we can also solve it in normal iterative loops! So here is my answer:

1- Learning recursion makes you a better programmer:

Learning and practicing recursion helps you improve your problem solving skills, because you will learn how to break down bit problems into smaller ones. Also, you will learn the principle of stack in data structure (A stack is an abstract data type that holds an ordered, linear sequence of items), the principle of LIFO (Last In First Out) and how to make use of the call stack.

2- Using recursion makes the code clearer:

Recursion code is simpler and shorter than an iterative code. The recursion function will be written in less lines of code and will be easier for debugging.

3- Recursion is data structure's best friend:

As I mentioned above, recursive functions use the call stack of the interpreter. So, we can make use of the existing of call stack instead of writing code and creating a stack by ourselves or by using any external libraries. which means we can use recursion whenever we want to use stack. Two good implementation examples for using recursion in data structures are trees and graphs in-depth traversal.

How to write recursive functions?

Before writing a recursive function ,let's talk about a few factors to be determined :

1- Determine the size factor:

The size factor means that your problem should not exceed your static value or your memory allocation for that particular program. In simple language your program should not have large numbers and not too many iterations. Because again, recursion functions use call stack and the call stack has a limit. When the stack becomes full the program will crash and you will have an error.

2- Determine the base case/s:

The base cause could be a single or multiple values depending on your program. I will use a while loop here to explain the base case .. if we want to write a program that print "hello world" 5 times using while, we will write:



def display_hello(i):
    while(i > 0):
        print("hello world")
        i -=1

The base cause determines when the loop will stop .. in our example the base cause is i=0 because when the value of i becomes zero the loop will break and stop.

Base case in recursion is that particular value that if we reach we want to stop recalling of the function and start removing and executing every function in the call stack.

Not having a base cause will make the function call itself until the call stack becomes full and the program crashes. Also, having a wrong base cause will result to a wrong output.

3- Determine the general case/s:
General cause is the one where the problem expressed as a small version of itself. Which means, the program will continue iterate the general causes until it reaches the base cause

In our example above, when i=0 considered as the base cause and we send 5 as a parameter , then we can think of:
i=1, i=2, i=3, i=4, and i=5 as the general causes.

Now, let's Write a recursive function and trace it using the previous problem:

We want to write a function that write "hello world" 3 times:

Let's analyze the problem:

The function will check the base cause, if the current case doesn't match the base cause then the function will call itself one time .. So the increasing is a liner (it could be O(n)) (it will be probably safe for the call stack size)
let's try writing our function now by using our while loop example

1- The base cause -> i =0



def display_hello(i):
   if i>0:

2- The print command -> print("hello world")



def display_hello(i):
   if i>0:
       print("hello world")

3- The changes in every iteration -> i-=1
to send the new value of the variable to the next function call we have to write it as a parameter



def display_hello(i):
   if i>0:
       print("hello world")
       display_hello(i-1)

And that's it for this small problem .. Before tracing it let's add one print command after the function call and show the result at the end to make the tracing more interesting

Assuming that the first invocation was :



display_hello(3)

And our function is :



def display_hello(i):
    if i > 0:
        print("hello world!")
        display_hello(i-1)
        print(f'The i value is {i}')

Now we will trace it.

In the first call the function will enter the call stack

Then the program will execute the commands :

When the execution reaches line 4 (the function recall) it will stop there (it will pause the execution of the rest commands) and add another function to the stack :

Then the program will execute the commands in the second recalled function :

Again , when the execution reaches line 4 (the function recall) it will stop there (it will pause the execution of the rest commands) and add another function to the stack :

For this time too , our base cause has not satisfied yet because i is still bigger than zero, so the execution will continue until the function recall and then adds another function to the stack.

Now finally the parameter is 0 which is the value of i

The execution will start until line 2 because the condition says that i should be bigger than zero, but i is equal to zero .. So we reached the base cause and we will not reach the recall "invocation" and the prints

Because this function finished all the commands that should be executed, it's the time to pop the function out of the stack :

Now we returned to the previous function when the parameter was 1
so now the program will execute the rest of the command/s:

The function now is completed all the commands that should be executed, time to pop the function out of the stack :

Now we returned to the function that its parameter is two and we will execute the rest of the commands :

Again, after we done the execution we will remove the function from the stack:

Now we have the first call which 3 was its parameter, and we will execute the rest of the commands:

And here the last function will pop out from the stack and the call stack will become empty and here is the end of our program:

Let's check if our tracing was right by executing the code :

So here we reach the end of today's article

Happy recursion 😁

Author Note:

I didn't use Fibonacci as an example because I believe that it is not a good example for teaching recursion and recursion is one of the worst solutions to solve Fibonacci in terms of both time and space.
View this article Fibonacci without recursiveness in Python - a better way

References:

Why Do Developers Choose Mobile First Approach

Manar Imad — Tue, 24 Aug 2021 17:41:53 +0000

Hello Designers ..

Today I was practicing front-end development, so that I thought that it would be a good idea to share some of what I learned about mobile first approach and bootstrap in a small article so you can benefit too.

Let's get started ..

The Idea of Mobile First Approach:

The mobile first approach looks at designing a website for a mobile device first. So consider how you would satisfy the screen constraints of your mobile device. And then as your screen size expands, you would automatically start an app to your website to the larger and larger screen sizes.

Why Mobile First Approach?

The answer for this question is simple: mobile design is more limited. So if you start from a small screen you can focus in the main and important features that could fit a mobile screen, then perhaps you're willing more and more of the content. So as to take advantage of the increasing screen real estate, which means the same website when seeing on a mobile device might have only parts of the information being revealed to the user. But then when rendered on a full fledge desktop it might show a lot more detail version of the website.

In addition, starting your website with mobile first and focusing more in the mobile design will make your website reachs more people because people tend to play more with their phone and we have 3.80 Billion phone users in the world! and the status of the world market share for mobile:55.77% comparing with Desktop:41.5%.

Fortunately we have many web UI frameworks including Bootstrap to work with the design and apply mobile first approach .. here is a list of some popular UI frameworks:

Bootstrap 2. Tailwind CSS
Semantic-UI 4. Foundation
Material UI 6. Pure
Skeleton 8. UIKit
Milligram 10. Susy
Materialize 12. Pure CSS

Bonus Info 🎉: What is Bootstrap?

Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web, because Bootstrap makes the web development faster and easier, also, it includes HTML and CSS based design templates for typography, forms, buttons, tables, navigation, modals, image carousels and many other, as well as optional , in addition to JavaScript plugins.
so we can create responsive designs with mobile first easily

Resources:

What does mobile-first design mean for digital designers?
getbootstrap
Front-End Web UI Frameworks and Tools: Bootstrap 4 Course by The Hong Kong University of Science and Technology - Coursera
mobile-first responsive web design
NUMBER OF MOBILE PHONE & SMARTPHONE USERS](Source: https://www.bankmycell.com/blog/how-many-phones-are-in-the-world)
Number of smartphone users from 2016 to 2021

From Regular Functions to Arrow Functions

Manar Imad — Tue, 24 Aug 2021 09:03:32 +0000

Hello World

One of the struggles for new JavaSript learners is understanding the different ways of writing a function including arrow functions , so for today, I'm planning to explain all types of functions in JavaScript in detail

So let's get started...

To explain the ways to write JavaSript functions let's divide them into two main types : Function Declaration and Function Expression.

1- Function Declaration

This is the type that we know and is similar to other programming languages' functions. Function declaration has two types :
a. Traditional Function:
the traditional(Regular) function has this pattern :
function functionName(optionalParameter/s){}
for example :

function print(){
console.log("hello world");
}

And with parameter:

function add(number1,number2){
return number1 + number2
}

b. Shorthand Function:
The shorthand function is a regular function but for a class .. the differnce in the pattern is that we don't write the function keyword so it will be :
functionName(optionalParameter/s){}

Let's see it in an example with a shorthand function we will call it login:

class user:
 constructor(name,email){
   this.userName = name;
   this.userEmail = email;
}
 login(){
 console.log(`Hello ${this.name} you have login successfully`);
}

2- Function Expression

Function expression is just like a function declaration but we assign it to an object(variable)
let's discuss its 4 types:

a. Regular FEs (Regular Function Expression)

Let's talk a bit about what that means:
If we have this function:

function print(){
console.log("hello world");
}

Then when we want to invoke it we type:

print()

But in regular function expression we will save the function in a variable "assign the function to a variable" such as :

let myPrint = function print(){
console.log("hello world");
}

Now what will happen if we try to invoke print?

That will cause an error telling us that print is not defined

So how can we reach the function ?
We can use the variable name (myPrint) that we assigned the function to.
In our example we assign a function directly to the variable which means our variable is from type function, so let's try to invoke it

Hooray it works 🥳!

b. IIFE (Immediately Invoked Function Expression)
From its name IIFE will be invoked immediately, you can think of it as if the function invoked itself and will be executed.
The syntax is simple .. we have a function :function functionName(){actions} you will contain the function between parentheses or "round brackets" (function functionName(){actions}) and end the function with another parentheses in this way :
(function functionName(){actions})();

So the bet with you now is: this function will be invoked immediately when the file execution starts

Let's write an example :

(function print(){
console.log("hello world");
})();

Let's start :

And let's execute it:

But wait .. We said we want to assign the function to a variable! Then let's do it :

let myPrint = (function print(){
console.log("hello world");
})();

What will happen now ?Let's use it :

Why didn't it work ???

The simple answer is because the IIFE invoked itself .. which means when we assign the function to the variable , the function immediately invoked and what has been saved "assigned to" our myPrint variable is the result.. so first we have to remove the invoke parentheses and try again :

So now it works and the type of the variable is undefined

Let's change the function to give the variable myPrint a string type:

c. Anonymous Function
It is an anonymous function and that's it ! Just a function without a name 😁 .. Here is the syntax:
[var|let|const] variableName = function(){actions}

Let's try it with this example :

Notice that the function here should be assigned to a variable otherwise it will cause an error

Extra example : let's try to combine both Anonymous Function and IIFE 😎:

d. Arrow Function

And we are here finally .. let's write the Arrow Function syntax in steps :

First :let's steal the Anonymous function syntax from above
[var|let|const] variableName = function(){actions}

Next :delete the function keyword:
[var|let|const] variableName = (){actions}

Finally: add (=>) sign after the parentheses :
[var|let|const] variableName = ()=>{actions}

And done .. this is our syntax so let's try it now :
Our example :

let myPrint = ()=> {
    return "hello world";
    }

Let's go!

Here we reached the end .. Happy invoking 😊

Deploy Django Project on Heroku Using Heroku CLI

Manar Imad — Fri, 20 Aug 2021 22:41:30 +0000

Hello World..

Every time I deploy my project on Heroku I make mistakes and forgot some steps. But not anymore, because today I decided to record them here for you and me.
I will include everything I know that could cause an error or a fail in deployment.

so let's get started

prepare and check your files:

STATICFILES_DIRS

not having STATICFILES_DIRS in the settings of your project will cause a fail in deployment so make sure to add this line

STATICFILES_DIRS =[
os.path.join(BASE_DIR, 'static')
]

Procfile

you have to add Procfile on the root directory and at the same level of your project and app/s to explicitly declare what command should be executed to start your app, add this line in the file

web: gunicorn myproject.wsgi

and make sure to replace "myproject" with your project name and to install gunicorn , you can install it in many ways such as pip install gunicorn or poetry add gunicorn "if you are using poetry"

create requirements.txt file

Heroku knows what libraries to install in its server by reading the requirements file so make sure to create one.
here is a one-line you can type in the command-line to copy the libraries and their version to the file if you are using poetry

poetry export -f requirements.txt --output requirements.txt --without-hashes

or this command if you are using pip :

 pip freeze > requirements.txt

check the allowed hosts

if your allowed host list in your .env file and/or the settings are for only the localhost then that will cause a problem. So you can add the URL of your Heroku app to the list such as

ALLOWED_HOSTS = ['mydjangoapp.herokuapp.com']

you can allow all hosts by using [*] then you are fine, and you can change it later after creating your Heroku app and have an actual URL link

make sure that everything is working just fine in your local

now we are ready to start, be sure you are standing in the right directory in your command line .. so here is the steps "commands" according to Heroku's official website:

heroku login
heroku create mydjangoapp --buildpack heroku/python
git init
heroku git:remote -a mydjangoapp
git add .
git commit -m "My first commit"
git push heroku main

if your deployment was a success then congratulations on everything you deployed your app successfully.

if you have an error then these are some suggestions :

If you get an error message with collectstatic write this command :

heroku config:set DISABLE_COLLECTSTATIC=1

install whitenoise and psycopg2 + add whitenoise on the top of the middlewares list in the project settings

'whitenoise.middleware.WhiteNoiseMiddleware'

now let's talk about having a database and you want to migrate it
1- we need to add PostgreSQL to our Heruko project through CLi

heroku addons:create heroku-postgresql:hobby-dev -a mydjangoapp

don't forget to see the PostgreSQL info and add them to the config vars
you can use this command :

heroku config:get DATABASE_URL -a <your_heroku_app_name>

the order of the info that you will get from the URL is like this:
postgres://<username>:<password>@<hostname/server>/<databasename>

next, here is the command to copy the .env vars to Heroku config vars :

heroku config:set $(cat .env | sed '/^$/d; /#[[:print:]]*$/d')

2- let's make migrations

heroku run python manage.py makemigrations

3- migrate to your Heroku database

heroku run python manage.py migrate

4- you can also create a super user

heroku run python manage.py createsuperuser

and here we reach the end .. have a good deploying 😊

References:

https://devcenter.heroku.com/articles/git