DEV Community: Justin Bigishiro

Ensuring Data Integrity: Constraints and Validations in Python Flask

Justin Bigishiro — Mon, 09 Oct 2023 20:17:46 +0000

Invalid data is the boogeyman of web applications: it hides in your database until the worst possible moment, then jumps out and ruins everything by causing confusing errors.It is essential to ensure data integrity and security in your applications. One crucial aspect of achieving this is through the use of constraints and validations. In this blog post, I will explore how to implement constraints and validations in Python Flask to ensure the reliability of your web applications.

Constraints and Validations: Why Are They Important?

Constraints and validations are essential for maintaining the quality and integrity of data within your web application. They help prevent incorrect or malicious data from entering your system, which can lead to various issues such as:
Data Integrity: Constraints and validations ensure that the data stored in your application's database is accurate, consistent, and follows predefined rules. This is crucial for reliable and trustworthy data.
Security: Validations can help protect your application from common security vulnerabilities, such as SQL injection, cross-site scripting (XSS), and data tampering.
User Experience: Implementing constraints and validations can enhance the user experience by providing immediate feedback to users when they enter incorrect or invalid data. Now, let's dive into how to implement constraints and validations in Python Flask.

1. Constraints

Invalid values in our database can cause all kinds of problems when we want to use the data. To keep invalid values out of our database we can use SQLAlchemy constraints. These constraints work at a database level to control the data we add to the database.

unique and nullable Constraints

The nullable constraint allows us to make sure the values added to the columns are not null. We can define this by adding the argument nullable=False to the Column constructor. If it's required that the values in your columns must be unique then the unique constraint can be specified by adding the argument unique=True to the Column constructor.
These two constraints are common in the login froms, the username must be unique to each user also, username and password must not be null. Here is a simple example

class Users(base):
    __tablename__='users'
    username = Column(String, Unique=True, nullable=False)
    password = Column(String, nullable=False)

CheckConstraint

CheckConstraints can be created for columns and tables. The text of the CheckConstraint is passed directly through to the database. Some databases like MySQL do not support CheckConstraints. Here is an example of a Patient table that uses constraints to control input of birth_year and death_year.

class Patient(base):
    __tablename__ = 'patient'
    name = Column(String(length=50), primary_key=True)
    # Constraint defined at the Column level
    birth_year = Column(Integer,
                        CheckConstraint('birth_year < 2023'),
                        nullable=False)
    death_year = Column(Integer)
    # Constraint defined at the Table level
    __table_args__ = (
        CheckConstraint('(death_year is NULL) or (death_year >= birth_year)'),
    )

Here we have a column CheckConstraint which makes sure we cannot add a birth_year that is greater than 2023. We also have a table CheckConstraint that makes sure the death year is after the birth year or the death year is null (meaning that the patient is still alive).

2. Validations

In the context of Python, validations are special method calls that go at the top of model class definitions and prevent them from being saved to the database if their data doesn't look right.
In general, validations consist of code that performs the job of protecting the database from invalid data.
Here is a basic example how we can validate an email.

class EmailAddress(Base):
    __tablename__ = 'address'

    id = Column(Integer, primary_key=True)
    email = Column(String)

    @validates('email')
    def validate_email(self, key, address):
        if '@' not in address:
            raise ValueError("failed simple email validation")
        return address

email = EmailAddress(email='banana')
session.add(email)
# => ValueError: failed simple email validation

In this example, we wrote a validate_email() function, preventing the object from being saved if its email attribute does not include @. We can return a custom message by raising a ValueError with the message.

Conclusion

Implementing constraints and validations in Python Flask is crucial for ensuring data integrity, security, and a better user experience. By using input validation libraries, database constraints, and custom validators, you can build robust web applications that handle data safely and reliably. Remember to always handle both front-end and back-end validations to provide a seamless user experience while maintaining data integrity.

Table JOIN in SQL

Justin Bigishiro — Sun, 27 Aug 2023 14:49:59 +0000

Tables are essential elements within a database.Tables are formed using columns, where each column must possess a name and a data type.A database can contain one or more tables and these tables can be modeled as relational. "In this blog, I will discuss how to establish relationships between multiple tables in SQL using JOIN operations.

A join clause in the Structured Query Language (SQL) combines columns from one or more tables into a new table. The operation corresponds to a join operation in relational algebra. Informally, a join stitches two tables and puts on the same row records with matching fields. Different types of JOIN include INNER JOIN, LEFT JOIN, RIGHT JOIN, FULL JOIN and NATURAL JOIN.
I am going to use the following tables to expain each type of JOIN.

Student Table

Student Course

1. INNER JOIN

An INNER JOIN query will return all the rows from both tables you are querying where a certain condition is met. In other words, INNER JOIN will select all rows from both tables as long as there is a match between the specified columns of each table.

Syntax:

SELECT table1.column1,table1.column2,table2.column1,....
FROM table1 
INNER JOIN table2
ON table1.matching_column = table2.matching_column;

Note that we can also write JOIN instead of INNER JOIN. JOIN is same as INNER JOIN. With our example of above, this query will show the names and age of students enrolled in different courses.

SELECT StudentCourse.COURSE_ID, Student.NAME, Student.AGE FROM Student
INNER JOIN StudentCourse
ON Student.ROLL_NO = StudentCourse.ROLL_NO;

Output

2. LEFT JOIN

A LEFT JOIN query returns all rows from the left, or first, table, regardless of whether or not they met the JOIN condition. The query will also return the matched data from the right, or second, table.

Syntax

SELECT table1.column1,table1.column2,table2.column1,....
FROM table1 
LEFT JOIN table2
ON table1.matching_column = table2.matching_column;

We can also use LEFT OUTER JOIN instead of LEFT JOIN, both are the same. In our example the query will become:

SELECT Student.NAME,StudentCourse.COURSE_ID 
FROM Student
LEFT JOIN StudentCourse 
ON StudentCourse.ROLL_NO = Student.ROLL_NO;

Output

3.RIGHT JOIN

RIGHT JOIN is similar to LEFT JOIN. This join returns all the rows of the table on the right side of the join and matching rows for the table on the left side of the join. For the rows for which there is no matching row on the left side, the result-set will contain null. RIGHT JOIN is also known as RIGHT OUTER JOIN.
Syntax

SELECT table1.column1,table1.column2,table2.column1,....
FROM table1 
RIGHT JOIN table2
ON table1.matching_column = table2.matching_column;

We can also use RIGHT OUTER JOIN instead of RIGHT JOIN, both are the same. In our example the code will be:

SELECT Student.NAME,StudentCourse.COURSE_ID 
FROM Student
RIGHT JOIN StudentCourse 
ON StudentCourse.ROLL_NO = Student.ROLL_NO;

Output

4. FULL JOIN

FULL JOIN creates the result-set by combining results of both LEFT JOIN and RIGHT JOIN. The result-set will contain all the rows from both tables. For the rows for which there is no matching, the result-set will contain NULL values.
Syntax

SELECT table1.column1,table1.column2,table2.column1,....
FROM table1 
FULL JOIN table2
ON table1.matching_column = table2.matching_column;

In our example the queries will be:

SELECT Student.NAME,StudentCourse.COURSE_ID 
FROM Student
FULL JOIN StudentCourse 
ON StudentCourse.ROLL_NO = Student.ROLL_NO;

Output

5. NATURAL JOIN

A natural join returns all rows by matching values in common columns having same name and data type of columns and that column should be present in both tables. Both table must have at list one common column with same column name and same data type.
The final table will accommodate all the attributes of both the tables and doesn’t duplicate the column.

Syntax

SELECT * 
FROM table1 NATURAL JOIN table2;

With our example the query will be:

SELECT * 
FROM Student NATURAL JOIN StudentCourse;

Output

This post aims to assist those learning SQL or any database-related courses. Feel free to leave comments if you spot any inaccuracies or if you'd like to share additional insights on the discussed topic. Your feedback is appreciated!

Sources:
https://www.sqlshack.com/an-introduction-to-sql-tables/
https://en.wikipedia.org/wiki/Join_(SQL)
https://www.geeksforgeeks.org/sql-join-set-1-inner-left-right-and-full-joins/

Mastering Event Listeners in React

Justin Bigishiro — Thu, 06 Jul 2023 11:53:17 +0000

Event listening is the process of creating event listeners in our code to listen for and react to events that happen on our webpage.
Event listeners play a crucial role in handling user interactions in React applications.
"Doing work" in response to "something happening" is known as event handling. Events are the "something the user does" and the "callback function" is the work that will happen in response to the event being triggered.
In this blog I will discuss different types of event listeners that are used in React and give examples on each type.

onClick - Handling Button Click

The onClick event listener is used to handle the click event on an element, such as a button. When the button is clicked, the specified function or method is executed.
Example:

import React from 'react';

const Button = () => {
  const handleClick = () => {
    console.log('Button clicked!');
  };

  return (
    <button onClick={handleClick}>
     Click me
    </button>
  );
};

export default Button;

In this example, we define a functional component called Button. Inside the component, we declare the handleClick function, which logs a message to the console. The onClick event listener is attached to the element, and when the button is clicked, the handleClick function is called, resulting in the message being logged to the console.

onChange - Handling Input Change

The onChange event listener is used to handle changes in an input element, such as a text field. Whenever the value of the input changes, the specified function or method is called.
Example:

import React from 'react';

const Input = () => {
  const handleChange = (event) => {
    console.log('Input value:', event.target.value);
  };

  return (
    <input type="text" onChange={handleChange} />
  );
};

export default Input;

In this example, we have a functional component called Input. Inside the component, we define the handleChange function, which receives the event object. When the value of the input changes, the handleChange function is called, and the current value of the input is logged to the console.

onSubmit - Handling Form Submission

The onSubmit event listener is used to handle form submissions. It is typically used in combination with the

element. When the form is submitted, the specified function or method is executed.
Example:

import React from 'react';
const Form = () => {
  const handleSubmit = (event) => {
    event.preventDefault();
    console.log('Form submitted!');
  };

  return (
    <form onSubmit={handleSubmit}>
      <button type="submit">Submit</button>
    </form>
  );
};

export default Form;

In this example, we define a functional component called Form. Inside the component, we declare the handleSubmit function, which takes the event object as an argument. When the form is submitted, the handleSubmit function is called, and it prevents the default form submission behavior using event.preventDefault(). Finally, a submit button is rendered within the form, and clicking it triggers the form submission and logs a message to the console.

onMouseOver - Handling Mouse Over

The onMouseOver event listener is used to handle the event when the mouse pointer moves over an element. It triggers the specified function or method when the mouse enters the boundaries of the element.
Example:

import React from 'react';

const Box = () => {
  const handleMouseOver = () => {
    console.log('Mouse over the box!');
  };

  return (
    <div onMouseOver={handleMouseOver} 
style={{ width: '200px', height: '200px', background: 'red' }}>
      Hover over me
    </div>
  );
};

export default Box;

In this example, we have a functional component called Box. Inside the component, we define the handleMouseOver function. When the mouse pointer moves over the

element, the handleMouseOver function is called, which logs a message to the console.

onKeyDown - Handling Key Down

The onKeyDown event listener is used to handle keydown events, which occur when a keyboard key is pressed while an element has focus (e.g., an input field). It triggers the specified function or method when a key is pressed.
Example:

import React from 'react';

const Input = () => {
  const handleKeyDown = (event) => {
    console.log('Key pressed:', event.key);
  };

  return (
    <input type="text" onKeyDown={handleKeyDown} />
  );
};

export default Input;

In this example, we define a functional component called Input. Inside the component, we declare the handleKeyDown function, which receives the event object. When a key is pressed within the element, the handleKeyDown function is called, and the pressed key is logged to the console.

As I said at the beginning, the event listeners are very important to understand, because without them it is difficult or impossible for the user to interact with the User interface.
I think this blog will be very useful to the readers and will help you to dive in deeper.

sources:

-https://www.learnhowtoprogram.com/introduction-to-programming/javascript-and-web-browsers/event-handling-with-event-listeners.
-chat.openai.com

MAKING DECISONS: IF...ELSE STATEMENT.

Justin Bigishiro — Sun, 14 May 2023 07:23:14 +0000

In everyday life, we achieve something because we have made some decisions. Some decision we make can lead us to good results and other decisions can destroy our life forever. One of the current decisions I have made is to become a software Developer and now I am learning my first programming language, Javascript.
In Javascript, like in any programming language, the code makes decisions depending on different inputs.
In this blog, I am going to discuss, the decisions we make depending on conditions.
Decision making will depend on the current situation or conditions for example when it is cold you turn on the heat, when feel hungry you cook or you make order at the restaurant.
In Javascript conditional statements allow us to represent decision making from the choice that must be made, to the resulting outcome of those choices.
The most common type of conditional statement in Javascript is IF...ELSE statement. The structure looks like this:

if (condition) {
  // code to be executed if the condition is true
} else {
  // code to be executed if the condition is false
}

With the if..else statement, sometimes we have two scenarios, for example if you are hungry, you cook, if you are not you watch TV. It is possible to have a lot of scenario.
Let take the following example.

let weather = "cloudy";

if (weather === "raining") {
  console.log("Don't forget your umbrella!");
} else if (weather === "sunny") {
  console.log("Enjoy the sunshine!");
} else {
  console.log("Well, at least it's not raining!");
}

The if...else statements can go from simple scenarios to very complex scenarios. we can have a situation in which a condition is depending on another condition; in some case we need to use a nested if...else block. Let us use this example:

if (choice === "sunny") {
  if (temperature < 86) {
    console.log( `It is ${temperature} degrees outside — nice and sunny. Let's go out to the beach, or the park, and get an ice cream.`);
  } else if (temperature >= 86) {
    console.log(`It is ${temperature} degrees outside — REALLY HOT! If you want to go outside, make sure to put some sunscreen on.`);
  }
}

If you want to test multiple conditions without writing nested if...else statements, logical operators can help you.

&& — AND; allows you to chain together two or more expressions so that all of them have to individually evaluate to true for the whole expression to return true.
|| — OR; allows you to chain together two or more expressions so that one or more of them have to individually evaluate to true for the whole expression to return true.
To give you an AND example, the previous example snippet can be rewritten to this:

if (choice === "sunny" && temperature < 86) {
  console.log(`It is ${temperature} degrees outside — nice and sunny. Let's go out to the beach, or the park, and get an ice cream.`);
} else if (choice === "sunny" && temperature >= 86) {
  console.log(`It is ${temperature} degrees outside — REALLY HOT! If you want to go outside, make sure to put some sunscreen on.`);
}

Let's look at a quick OR example:

if (iceCreamVanOutside || houseStatus === "on fire") {
  console.log("You should leave the house quickly.");
} else {
  console.log("Probably should just stay in then.");
}

The if...else statement is very important in web development, for example we can use it in password validation when building a web application. we can make a function with if..else conditions that check the strength of the password whether it is easy, medium, difficult or extremely difficult to guess. This is an example of a function that checks if a user's password is strong enough.

 function checkPasswordStrength(password) {
  if (password.length < 8) {
    console.log("Password is too short!");
  } else if (!/\d/.test(password)) {
    console.log("Password should contain at least one number!");
  } else if (!/[A-Z]/.test(password)) {
    console.log("Password should contain at least one uppercase letter!");
  } else {
    console.log("Your password is strong!");
  }
}

checkPasswordStrength("WeakPwd1"); // Output: Password should contain at least one uppercase letter!

In conclusion, If...else is very important in Javascript. It is used mostly in all web applications. Every web development student should have a strong understanding of this condition statement as the foundation of decision making scenarios.

Sources:
https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/conditionals.
https://marketsplash.com/tutorials/javascript/javascript-if-else/