DEV Community: btryon-glitterkitty

Meerkats! SQLAlchemy! Mob magic?

btryon-glitterkitty — Sun, 23 Apr 2023 23:25:02 +0000

-ben tryon

Of all the relationships you encounter in life, the most important, by far, is the one between you and your colony. As a meerkat, I have a responsibility to stand atop photographer's heads, tree stumps, other 'kats... it's a life to... look out for.

One-to-many relationships and many-to-many relationships are pivotal to the life of a meerkat when they interact with Flask, Python (not that type!) and SQLAlchemy. These three languages are how we had our first house and all it's tables built.

A one-to-many relationship is when one item in a table is associated with multiple items in another table. My colony can have many meerkats, multiple meerkats. A many-to-many relationship is when multiple items in one table are associated with multiple items in another table. One meerkat can dig many tunnels in our home colony, and one colony can have multiple meerkats contributing to digging one tunnel.

To represent these relationships in Flask, we can use SQLAlchemy. We can create two tables, one for colonies and one for members - these are one-to-many relationships - and use a foreign key to link the two:

from flask import Flask
from flask_sqlalchemy import SQLAlchemy

app = Flask(__name__)
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///meerkats.db'
db = SQLAlchemy(app)

class Colony(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String, nullable=False)
    tunnels = db.relationship('Tunnel', backref='colony')

class Tunnel(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    length = db.Column(db.Float, nullable=False)
    colony_id = db.Column(db.Integer, db.ForeignKey('colony.id'), nullable=False)

Two classes, 'Colony' and 'Tunnel' are defined and correspond with the tables in the database. The 'Colony' class has a 'tunnels' attribute that creates a one-to-many relationship with the 'Tunnel' class using the db.relationship() function. I also defined a foreign key 'colony_id' in the 'Tunnel' class to link it back to the 'Colony' class. It is amazing what one can do with curved claws and a propensity to watch. We, the mob, saw a researcher from NatGeo typing away on their Lenovo. We one-upped her. She was like 'whoa! Meerkats! Coding in Python! And with claws-adapted keyboards!' That was a fun day.

Let's move on to many-to-many relationships. I created a third table, called a join table (they wouldn't call it a 'mob' table! Owls and their parliament, wildebeests and their confusions get all the good group names...)

class Meerkat(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String, nullable=False)
    tunnels = db.relationship('Tunnel', secondary='meerkat_tunnel', backref='meerkats')

meerkat_tunnel = db.Table('meerkat_tunnel',
    db.Column('meerkat_id', db.Integer, db.ForeignKey('meerkat.id'), primary_key=True),
    db.Column('tunnel_id', db.Integer, db.ForeignKey('tunnel.id'), primary_key=True)
)

My NEW 'Meerkat' class was created and I updated the 'Tunnel' class to use a many-to-many relationship. These relationships are mad real for us. Without them, we'd be a bunch of house cats. I also defined a join table called 'meerkat_tunnel' that has the foreign keys to both the 'Meerkat' and 'Tunnel' tables. This is the magic of tables - the join and the relationships allow an interplay of activity and code. The join table is the bridge to the two tables being linked - it stores the foreign keys of both tables and maps the associations of each. The defining of the foreign keys - the column of integers to identify row-embedded information for meerkat_id and tunnel_id - allowed the queen to query all the tunnels that a particular meerkat had dug or gave her the tools to find that the mob had worked on a particular tunnel. She had admonished us for laziness a few days earlier. Little did she know, she was soon to have a midnight meeting with a hyena, not our fault she took a wrong turn!

I am next on lookout, so gotta wrap it up: designing and building robust databases are dependent upon an acute understanding of one-to-many and many-to-many relationships. Our tunnels would not have been built without the planning of our python crew. It helped us visualize and scale the growth to make our colony an interconnected maze of a subterranean city. Whether you're a NatGeo researcher or a wildebeest, SQLAlchemy is a powerful tool that can help you efficiently manage your data and relationships.

Python - classless hooligan?

btryon-glitterkitty — Sat, 01 Apr 2023 04:03:11 +0000

-ben tryon

Python3 has been used to create maps of both the modern and ancient world navigable by sound and touch. It has been used to create a weather forecast system that scores historical forecast data with actual weather data, producing data mining of striking accuracy. And it has been used for collaborative drug discovery. One could say Python is an amazing tool of the future, even the language of the future. But that only matters if the code works. Understanding the top-level properties within python is a powerful manner of ensuring working code.

Classes are user-defined. They are blueprints waiting to be filled with data and functionality, making them and python easy to reuse and maintain.
For example, we define a Person class as follows:

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

*init is a specific method that is called when an instance of class is created.
To create an object, we first define the class, then we create an instance of the class. We would create an instance of the Person class like so:

person1 = Person(‘Awad’,30)

In this example, we created an instance of the Person class with the name “Awad” and an age of 30 years old.

Instances are objects that are created from a class. They are unique, as each may have it’s own attributes. Attributes are variables that belong to an object and are tiny containers, used to store data. In Python3, attributes can be defined at both the instance and the class levels. A gender attribute is added to the Person class, below:

class Person:
            def __init__(self, name, age, gender):
                        self.name = name
                        self.age = age
                        self.gender = gender

We then can update the instance of the updated class:

person2 = Person(“Jewel”, 25, “female”)

Class objects are objects that represent a class and are used to access class-level attributes and methods. Class-level attributes are shared by all instances of a class, while instance-level attributes are unique to each instance. Our Person class receives a class-level attribute, representing the total number of persons. It is then incremented:

class Person:
            def __init__(self, name, age, gender, count):
                        self.name = name
                        self.age = age
                        self.gender = gender
                        Person.count += 1

The count attribute can be accessed using the class object:

Print(Person.count)`
 
Method objects are objects that represent a method of a class. They can be used to access or call the method of an instance or of a class. Methods can be defined at both the instance and the class levels. 
 
In Python3, class-level methods are defined using the @classmethod decorator. A class-level method is added to our Person class to print the total number of persons:
 
class Person:
            count=0
            def __init__(self, name, age, gender, count):
                        self.name = name
                        self.age = age
                        self.gender = gender
                        Person.count += 1
            
            @classmethod
            def print_total_count(cls):
                        print(f”Total number of persons: {cls.count}”)

Understanding the top-level properties of Class and Method with their attendant attributes and instances will help any programmer utilize the powerful Python language.

The sexy expressions between the slashes

btryon-glitterkitty — Sat, 11 Mar 2023 03:27:42 +0000

by ben tryon

Form Validation is that part of a form or webpage that says "no, your password must have a plus, asterisk, capital letter or kitchen sink to be a valid password".

Form validation takes any form… such as validating an ISBN to search for a book. ISBNs are either 13 or 10 alpha-numeric characters that identify a book.

When this search occurs, a few behind-the-scenes actions are taking place:
First, the data controls of the form are taken into account. In other words, the controls that determine the text-boxes have text, that the radio buttons are clicked, that the checkboxes are marked, etc.

If these controls are exactly entered, this is a quick action. If incorrect, the ghost in the machine appears and everything slows down: forms are rejected by the server, travel back to the client and the process starts over.

Client-side is defined as processes within the browser. Client-side validation checks of form data determine if entered data is exactly correct within the application constrains. If so, that data is allowed to be saved on the server and server-database when it reaches there.( That process is not part of this article scope. )

Regular expressions are the lynchpin of form validation. Why? Because “RegExp” allow code within the code to work and thus, truly power the controls process. A regular expression literal begins with this pattern: ‘const re = /’as in

const re = /ab+c/i;

and between the slashes is: /pattern/modifiers (the pattern is ab+c and the modifier is i)

Keeping the code between the slashes as “constant”, performance improves… if the ISBN is always the target of your backend or database search, and only the 10 values change, the other database information can be ignored, and everything is then faster:

const re = /isbn/;

To enable event better performance, use a constructor: The constructor function takes either a string or a RegExp object as its first parameter and a string of optional flags as its second parameter. These flags are modifiers.

const re = /ab+c/i //regular expression literal notation again
const re = new RegExp(/ab+c/, “i”) //a constructor with a literal notation expression
const re = new RegExp(“ab+c”, “i”) //a constructor with a string {“”} pattern as the first argument

In general, there are three RegularExpression modifiers:
i – a global case search of all words, regardless of capitalization
g – a global search to return the specific combination (either a word or phrase or number, etc)… by the way, you can combine “i and g” for a global, case insensitive search
m – a simple, multiline search that stops after the first match and is case sensitive

The regex snippet below matches a 10-digit ISBN. The test() checks if the input matches the format. An error is presented if it does not match.

function handleChange( e ) {
…
  } else if (name === "isbn") {
    const regex = /^(97(8|9))?\d{9}(\d|X)$/;
    if (!regex.test(value)) {
      error = "Invalid ISBN format! Only 10 characters!”
    }

•^ indicates the start of the string
•(97(8|9))? matches the prefix for the ISBN-10 format.
•\d{9} matches the 9 digits that make up the core of the ISBN code. This can be the 10 digits of an ISBN-10 code.
•(\d|X) matches the last digit of the code. This can be either a digit or the letter "X", which is used to represent the digit “10” in ISBN-10 codes.
•$ indicates the end of the string.

Form validation is pivotal in client-side and server-side interactions. Creating and enabling validation makes for faster interactions, correct information and more complete code.

The power of the bar graph: DOM manipulation via Javascript

btryon-glitterkitty — Fri, 17 Feb 2023 18:57:19 +0000

-ben tryon
Back at the beginning of the browser wars, Netscape and Microsoft were battling for supremacy. The results were the DOM iterations. The Document Object Model gives users the ability to relate to and manipulate HTML elements and layers of webpages and scripts.

Part of programming is grabbing and changing the interior structure of computer memory. The DOM represents this memory structure in a Document, and includes style and content. Each element of the Document is a part of this structure and the overall DOM structure looks like a bar graph reaching to the sky. Each bar is a Node, each Node has parts –“parents” and “children” - that are attached to it and can be manipulated.

Both the “recent” DOM iteration and event manipulation are considered the keystone markers of longevity for Javascript. Javascript works exceedingly well with the DOM, even though the DOM is “language-neutral”. JS throws few errors when manipulating the DOM. Event listeners are methods of “Event Targets”. “Event Target” is a node that acts when a function targets it and changes the DOM (if applicable).

Event Listeners are powerful because they can add, subtract and otherwise influence the DOM “bar graph”. For example, one needs a button added to the page. This is a function button that did not exist in the HTML beforehand. It can be clicked, and, by user action, create a response:

`const button = document.createElement("btn");

document.getElementById("btn").addEventListener("click", displayDate);`

JavaScript moves through the DOM by creating an Element of the HTML, grabbing it by a handle (the Id) and adding the button and it’s action (a function, defined elsewhere, that displays the date).

When the browser wars were hot, a major question was why and how to capture interaction beyond submitting forms, prompt alerts and the like. DOM evolution, developer democratic criticism and the browser developers taking note, allowed the browsers to become open forums for change. In other words: we can now make CSS, HTML and the Document conform to our needs because early client-side devs wanted control, the Netscapes/Microsofts helped them and the DOM allowed it. Javascript was the best language for this new level.

Event Listeners change DOM interaction via Javascript to a further degree because the Target node of the DOM is accessible via JavaScript. This Target allows a processing interaction to occur with data-node access and the right data. Targets are the aim of Event Listeners.

Below, the Target demonstrates the ability of the developer to start with an idea (starting/stopping gas pump flow). They may then manipulate the DOM through Elements. The user, developer, and browser can make choices now via logic: They all decide whether conditionally stopping or starting the gas flow/the Target meets their purpose.

`function gasPump(event) {

const pump = document.getElementById("pump");
if(event.target.style.background-color == "red"){
event.target.style.background-color = "blue";
event.target.innerText = "Stop Pump Flow?";
pump.style.visibility = "visible";
} else {
event.target.style.background-color = "red";
event.target.innerText = "Continue Gas Flow";
pump.style.visibility = "hidden"
}
}

document.getElementById("myBtn").addEventListener("click", gasPump);`

Overall, computers are simple – they take information and display it. Javascript and the DOM allowed unparalleled access to the browser, the Document layer underlying it and the foundational structure. Users and developers benefited from this. This combination finds the ability to use conditional, actionable functions to make computers resources and tools of a previously quixotic future.