Forem: Jonathan Hammond

Python Data Types

Jonathan Hammond — Sun, 25 Jul 2021 01:19:07 +0000

This article is going to explore Python data types.

What is a Data Type?
Data Types are attributes of data which tell compilers and interpreters how the data is intended to be used(1). In Python, there are over a dozen data types, which can be categorized in several ways.

Built-in Data Types: Primitive

String
Python contains the Text Type 'str,' which is short for string. Strings are arrays of bytes representing Unicode characters (2). In Python, strings are surrounded by single or double quotations, and can be formatted in a number of ways. For example, formatted strings known as string literals or f-strings come with an attractive design pattern that can be enclosed in single, double, or even triple quotes. f-strings utilize curly {} braces so you can embed variables within a string. It even allows us to evaluate expressions like arithmetic, function calls, etc.! That's part of what makes f-strings so powerful and popular in Python. Technically speaking, it is totally within reason to perform calculations with numeric types within an f-string. However, f-strings, which are expressions evaluated at runtime, are not a constant value and ultimately return a string value, so even the numbers within your expression become strings in this regard.(3, 4, 5).

Other primitive data types include numeric types such as 'int' (integer), 'float' (decimal points) and complex, as well as Boolean types ('bool'). A full list of Python Data Types can be found in the links ending this article(6).

Floats & Integers
Floats stand for "floating point number" and contain one or more decimals, which differentiate them from the integer primitive data type. In simple terms, think of why you would want this: 4 / 2 = 2, but 5 / 2 = 2.5. In some limited forms, a computer might even process this to 3 or 2. To perform the math correctly, we need decimal points. However, There are a couple things to note about Floats. One, that Python is like many other programming languages. However, by comparison to the JavaScript programming language, which does not define different types of numbers, because in JavaScript they are always stored as double precision floating point numbers (7). I just thought I would point that out, as I myself am coming from a JavaScript background, so this was a new, albeit basic data type for me. Second, floating point arithmetic is by definition not completely 100% accurate, because values are represented by fractions (8, 9). This might not affect your day to day programming life, but it is good to know. For example, at work, where I support a Salesforce application that is built with Apex, precise calculations can commonly be off by a penny, which doesn't seem like it would matter, until you are working with multiple multi-billion dollar businesses who frequently utilize reports and perform calculations requiring exact precision. Oh, major third one I just learned now: Floats can also be scientific numbers with an "e" to indicate the power of 10: 35e3.

An integer is a whole number, positive or negative, without decimals, of unlimited length. I ripped this straight from w3 schools, which I have already linked below. Common integers include 0,1,2,3,4,5,6,7,8,9,10, and so on. There isn't a whole lot to cover for integers right now. The number 0 is kind of a unique case however, in that it is also a way to say False (as opposed to True, which could be described as 1 in programming). This is because in Python and other languages, individual values can evaluate to either True or False: values that evaluate to False are considered Falsy, and values that evaluate to True are considered Truthy(10). Before I get into any more examples, allow me to first discuss the Boolean primitive data type.

Booleans
In the 1800s, George Boole defined an algebraic system of logic(11). All that matters for now is that Boolean data types in Python represent one of two values: True or False. This simple Yes/No sort of value works perfectly for if-statements, as well as for loops. Wherever your code requires a condition or to meet a certain criteria, that criteria should be cleanly defined. Simply put, that condition is either met or not met. Boolean data types are critical pieces of data because of how powerful they are. Also, you won't exactly be seeing True and False written out all the time, but rather the evaluation of an expression that reduces to one of those values. Keep in mind I am a beginner, so part of this information is my observation and should not be taken as gospel.

Here is an example of a string, integer, and Boolean data type:
print('Are you legal drinking age? ', 18 < 21)

Even in such a simple statement above, we are using a built-in Python function that returns human-readable output to the screen. We are passing arguments (not parameters) into this function(12). We are using the 'Less than' comparison operator to compare if 18 is less than 21. Since this expression evaluates to False, what the print function returns to us is actually the word False, since the above expression evaluates to a falsy value.

Expressions
Expressions are representations of value - they need to be evaluated(13). In Python, an expression only contains identifiers, literals, and operators. Identifiers are names given to the fundamental building blocks in a program, are are user-defined to represent a variable, function, or any other object(14, 15). Literals are a succinct way to write a value. In Python and other languages, literals represent the possible choices in primitive types for that language. A full list is linked below, but some examples include Boolean (True, False), String ('lesser', 'greater') and Integer literals (0, 1, -2)(16). Operators are special symbols in Python that carry out arithmetic or logical computation.

If we were to analyze our above example, 18 and 21 would be examples of Integer Literals, and < would be an example of an Operator. If we wanted to make our expression more flexible and inclusive, we could use a variable. For instance, if a user inputs their age (for me: 30, for you it may be different), we can store that number in a variable then use it in our example like this: age < 21. If we were to do this, we would then also be using an Identifier.

Logical and Identity Operators
The reason for this detour on expressions is to highlight how complex an expression can become that simply evaluates to True or False. For example, we can utilize logical operators to combine conditional statements, or identity operators to compare objects. Here are some example that use all the Logical Operators:

18 < 21 and 24 < 21 evaluates to the Boolean data type False, because with an and operator, both statements must be True.
18 < 21 or 24 < 21 evaluates to True, because with an or operator, at least one statement must be True, and the above essentially states False or True.
not(1 < 0 and 2 < 0) evaluates to True, because the not operator reverses a result. If you are familiar with PEMDAS, Python follows this and so contents within a parentheses are evaluated before exponents, subtraction, etc. In this case, the inner contents evaluate to False, so reversing False evaluates to True.

Here are examples using the Identity Operators:

sister, brother = 21, 21 # sister is brother - If we were to print(sister is brother) we would read True, because we are essentially asking Python to compare 21 to 21 to see if they are the same object.
print('sister' is not 'brother') evaluates to True. Here, we are comparing two strings to see if both sides are the same object. I am not certain, but I believe Python String characters are comprised of ASCII encoding, which uses numbers to present English characters(17, 18). As you may have inferred, the characters in each of the above strings would boil down to different number sequences, therefore it is True that, in essence, a is not b.

Truthy and Falsy Values
One simple way to determine an item's Boolean value is by using the bool() function(19). Truthy values that will evaluate to True include Non-empty sequences or collections such as lists, tuples, strings, dictionaries, and sets, Numeric values that are not 0 (remember earlier?), and the word True. Conversely, Falsy values include Constants such as False or None, 0 of any numeric type, and anything empty of the following: lists [], tuples (), dictionaries {}, sets set(), strings "" or ranges range(0)(10, 20).

ASIDE
To put things into perspective, consider how problematic binary thinking is in many societal discussions. We could be talking about political policy, pandemics and vaccines, personal topics and so forth. Most therapists would advise against absolutist thinking, which can be characterized by viewing things as all or nothing, black or white, etc. This "all or nothing" principle extends to polarized thinking. On top of that, many people often generalize things that are incredibly nuanced. They don't even extrapolate. They merely assume by effortlessly abstracting away relevant contextual concrete information, until all that remains is an opinion that is hardly rooted in any fact at all. As the old saying goes, "All generalizations are false, including this one."(21)

By comparison, computers due not tend to fall to common psychological follies as humans are apt to do. If your if-statement does not run, it may have evaluated to False. Understanding something as simple as this should help you debug your program, as you investigate the Error of your code. This digression has been brought to you by writing this without a break.

Built-in Data Types: Non-Primitive

In case I didn't mention it earlier, primitive or basic structures contain pure and simple values of data. By comparison, non-primitive data structures store not just value(s), but a collection of values in various formats(22).

Lists
In Python, there are three basic sequence types: lists, tuples, and range objects(23). A sequence is any ordered collection of objects whose contents can be accessed via "indexing"(24). Lists are used to store multiple items in a single variable: friends = ['suchan', 'ross', 'desirée']. List items are indexed and start at 0. If I wanted to access 'Suchan' above, I could do this: print(friends[0]). List items have a defined order that will not change (25). I won't say it's a best practice, but I will say that it is very common that a list will all contain the same data type. With that being said, your code won't break simply by having a float, integer and string within a list(26). Bear in mind that lists and other sequence and mapping types are iterable, meaning it is capable of returning its members/elements one at a time, permitting it to be iterated over in a for-loop(27). While there may be no issue looping over a list of [1, 'two', False], note that data types have specific built-in methods that are only applicable to that data structure. So for instance, if you were looping over my friends list with the .capitalize(), that would be fine because the first letter of each element could be capitalized. However, as seen with my mixed data-type example, applying the same method would result in a Python error: AttributeError: 'int' object has no attribute 'capitalize'.

Tuples
Tuples are usually used when you have a known collection of mixed types. I am still learning about them, as I rarely used them in JavaScript except in React, and even then I am pretty sure they weren't technically Tuples(28). Tuples are used to store multiple items in a single variable. Personally I think they are really cool and fascinating, but as I am brand new to them, I really don't feel qualified teaching you anything about them. So, maybe join me in watching this video Socratica has on Python Tuples!(29)

Sets
Sets are another data type I am not familiar with yet. All I know is that they are also used to store multiple items in a single variable. The only thing I will state for now, is that in comparison to Tuples, which are Ordered, Unchangeable and Allow for Duplicates, Sets are Unordered, also Unchangeable and do not Allow for Duplicate values(30, 31).

Dictionaries
I can finish off this article strong by talking about Dictionaries. In JavaScript, what I know there as Objects are considered in Python to be Dictionaries. In all honesty, I think it's a better name, since both languages are object-oriented.

Dictionaries are Mapping data types that are used to store data values in key:value pairs. Things get pretty wild here, because a dictionary can hold dictionaries. For instance, two keys in a dictionary could be Quarterback names like 'Patrick Mahomes' and 'Tom Brady', but their value could be a dictionary that holds further keys such as passing stats, with each corresponding value being a list of say, yards, touchdowns and interceptions, over the course of each week of a season. In contrast to Tuples and Sets, Dictionaries are Changeable, meaning that we can change, add or remove items after the dictionary has been created(32). Compared to List syntax, dictionaries will roughly look like this: parents = { "mom": "Marie" }, though a dictionary's values can be of any data type(33). By comparison, a dictionary's keys must be of an immutable data type such as strings, numbers or tuples (34). A list of Immutable and Mutable Data Types in Python can be found here(35).

Wrapping Up
As you can see, there is a lot to learn about Python data types. Mastering the fundamentals practically takes you into becoming hirable in many fields. I know I have a lot to learn when it comes to the non-primitive data types in particular. Understanding how to use each, or at least the most common data types in Python are exponentially extended once you begin forming programs with built in methods, user defined functions, classes, if-statements, for loops and so forth. At first, so much information will populate your short-term memory, that you may feel anxious because no brain is wired to absorb all that information at once. Even computers have finite memory.

If you are interested in learning more about Python, I strongly recommend googling FreeCodeCamp and Socratica. If you are eager to learn more about the brain and how to learn, I strongly recommend the course below(36).

In closing, I understand this was not a complete tutorial into the data types of Python, but for you and for me, this was a beginning and a direction as to what you can learn next. Feel free to reach out to me on Twitter (@jonamichahammo ) or LinkedIn (linkedin.com/in/jonamichahammo). I keep it informal on the bird and formal on the business social media, so choose one or both, or neither!

I hope you've enjoyed. Bye bye.

A full list of Python Data Types can be found here:
https://www.w3schools.com/python/python_datatypes.asp

Citations:
(1)https://en.wikipedia.org/wiki/Data_type
(2)https://www.geeksforgeeks.org/python-data-types/#:~:text=Tuple-,String,is%20represented%20by%20str%20class.
(3)https://www.datacamp.com/community/tutorials/f-string-formatting-in-python?utm_source=adwords_ppc&utm_campaignid=1565261270&utm_adgroupid=67750485268&utm_device=c&utm_keyword=&utm_matchtype=b&utm_network=g&utm_adpostion=&utm_creative=332661264365&utm_targetid=aud-438999696719:dsa-429603003980&utm_loc_interest_ms=&utm_loc_physical_ms=9001941&gclid=Cj0KCQjw9O6HBhCrARIsADx5qCQwM75K4E4MKs5Zf90V5j3VSQZPMii1_Kaiv6zxNeTAgIpfy47gq-0aAthCEALw_wcB
(4)https://www.python.org/dev/peps/pep-0498/#:~:text=F%2Dstrings%20provide%20a%20way,which%20contains%20expressions%20inside%20braces.
(5)https://www.geeksforgeeks.org/python-data-types/#:~:text=Tuple-,String,is%20represented%20by%20str%20class.
(6)https://www.w3schools.com/python/python_datatypes.asp
(7)https://www.w3schools.com/js/js_numbers.asp#:~:text=Unlike%20many%20other%20programming%20languages,the%20international%20IEEE%20754%20standard.
(8)https://stackoverflow.com/questions/6563058/how-do-i-use-accurate-float-arithmetic-in-python#:~:text=Floating%20point%20arithmetic%20is%20by,as%20another%2C%20more%20general%20article.
(9)https://stackoverflow.com/questions/11522933/is-floating-point-arbitrary-precision-available
(10)https://www.freecodecamp.org/news/truthy-and-falsy-values-in-python/#:~:text=Truthy%20values%20are%20values%20that,type%2C%20None%20%2C%20and%20False%20.
(11)https://en.wikipedia.org/wiki/George_Boole#Symbolic_logic
(12)https://developer.mozilla.org/en-US/docs/Glossary/Parameter
(13)https://www.hackerearth.com/practice/python/working-with-data/expressions/tutorial/#:~:text=Python%20Expressions%3A,of%20the%20string%20as%20well.
(14)https://data-flair.training/blogs/identifiers-in-python/
(15)https://www.programiz.com/python-programming/keywords-identifier
(16)http://net-informations.com/python/iq/literals.htm
(17)https://www.tutorialsteacher.com/python/string-isascii
(18)https://www.ascii-code.com/
(19)https://www.programiz.com/python-programming/methods/built-in/bool
(20)https://www.freecodecamp.org/news/truthy-and-falsy-values-in-python/#:~:text=Truthy%20values%20are%20values%20that,type%2C%20None%20%2C%20and%20False%20.
(21)https://www.brainyquote.com/quotes/mark_twain_137872
(22)https://datalya.com/blog/python-data-science/difference-between-primitive-and-non-primitive-data-types
(23)https://docs.python.org/3/library/stdtypes.html#:~:text=There%20are%20three%20basic%20sequence,%2C%20tuples%2C%20and%20range%20objects.
(24)https://www.pythonlikeyoumeanit.com/Module2_EssentialsOfPython/SequenceTypes.html
(25)https://www.w3schools.com/python/python_lists.asp
(26)https://stackoverflow.com/questions/11387752/am-i-safe-mixing-types-in-a-python-list
(27)https://www.pythonlikeyoumeanit.com/Module2_EssentialsOfPython/Iterables.html#:~:text=An%20iterable%20is%20any%20Python,over%20in%20a%20for%2Dloop.
(28)https://ntgard.medium.com/tuples-in-javascript-cd33321e5277
(29)https://www.youtube.com/watch?v=NI26dqhs2Rk
(30)https://www.w3schools.com/python/python_sets.asp
(31)https://www.w3schools.com/python/python_tuples.asp
(32)https://www.w3schools.com/python/python_dictionaries.asp
(33)https://www.google.com/search?q=can+a+dictionary+value+be+any+data+type&rlz=1C1CHBF_enUS922US922&oq=can+a+dictionary+value+be+any+data+type&aqs=chrome..69i57j33i160.7258j0j9&sourceid=chrome&ie=UTF-8
(34)https://realpython.com/lessons/restrictions-dictionary-keys-and-values/#:~:text=Almost%20any%20type%20of%20value,objects%20like%20types%20and%20functions.&text=Second%2C%20a%20dictionary%20key%20must,Boolean%20as%20a%20dictionary%20key.
(35)https://towardsdatascience.com/https-towardsdatascience-com-python-basics-mutable-vs-immutable-objects-829a0cb1530a
(36)https://www.coursera.org/learn/learning-how-to-learn

Review: a React Todo App Tutorial

Jonathan Hammond — Sun, 13 Jun 2021 20:11:38 +0000

Recently I followed along a 'Build A Todo App With REACT' tutorial by Dev Ed on YouTube. I wanted to review and write about what I learned, as this is a new technique I would like to add into my habits.

Note: This review reaches only to the half hour mark. One thing this review process has taught me, is that it is better to start with 15-30 minute videos, rather than a 90-minute video. Highly recommend watching DevEd's tutorial!

Obligatory Spoiler Alert The tutorial was amazing. You create a Todo list. It's not perfectly mobile responsive. Some of the concepts you will learn about by following this tutorial include Component building, Properties (prop) drilling, State managing and storing through the localStorage object.

How do you begin?

Ed begins with a simple introduction to the project, explaining that this is straightforward Todo app in React, which gives you a good grasp on how to make future projects in React as well. He also adds a quick aside about his health, which overall I enjoyed for one particular reason (other than that he is focusing on his health!). You will notice early on that Ed is a very friendly and humorous content creator. If this style is your cup of tea, then I think you will have a lot of fun learning through his content.

One plus about this video is that he installs react in the beginning, so if you are new to coding in some way, don't be afraid.

After your react app is created, you will delete several unnecessary files, and run the app with npm start as your first test.

One of the first items that are covered is the usage of className while writing JSX code. The reason for this is that, while you are basically writing what looks like HTML, you are still writing this in JavaScript, and as you may already know, the class keyword is a reserved keyword, but worry not. If you forget and you define an HTML attribute with class on accident, the app will let you know shortly afterwards.

A Quick Aside - Past Code Required

Ed references a previously made project of the same app except in vanilla JavaScript, which you can find here. You won't be covering custom CSS much at all in this project, so this is where you will be getting a lot of the content to copy over.

Components

The components covered in this tutorial are named <Form>, <TodoList>, and <Todo>. The Form component is essentially an input element, a dropdown option menu, and a submit button.

Form

You begin by importing React. You have the option of creating components through the function keyword, but the author chooses to go with arrow function syntax. This makes sense, because it is 2021, React came out in 2013, and ES6 syntax (such as arrow functions) came out in 2015. But if you prefer to go with the function keyword, both should work.

A Quick Aside - Using `return` in JSX

It took me a few projects to remember that parentheses are used in JSX to return multi-line JSX code. I believe this is because JavaScript doesn't support functions that return multiple values, though you can wrap multiple values into an array or an object and return that. I think that is what is going on with return ( ), but I am not 100% sure. You can read more about this here and here.

After creating your component, you will follow up the function with export default [component name] and import the item within your App.js file.

A best practice that seems apparent is to name your component after your file name. Here is when TodoList is first created, but there was not enough time spent on it for me to write about it yet.

React

Ed describes how the React library works with data, and how you will be telling your App "what to do."

Based on that data, the application is going to react. The whole goal is to get our Todos, is to get any inputs or whatever that we're using on our web app, and get them into state ... Once it's in state, your UI is going to automatically react to all the changes.

A Quick Aside - State

Simplilearn has a great short video on what State is in ReactJS and can be viewed here. In a nutshell, State "is an object that stores the values of properties belonging to a component that could change over a period of time." These changes are generally updated by event handlers. They can change the data they hold over time, and store the data that has to be rendered to view. Dev Ed also has an entire hour-long video (in a playlist!) on React State and Props that can be found here.

useState

useState is a React hook that lets you add state to function components.. What is a hook? According to React documentation:

A Hook is a special function that lets you "hook into" React features.

The useState hook is called directly inside a component. Calling it declares a state variable, which can be named basically anything. This variable preserves some values between function calls. It is basically a newer version of this.state, if you have ever initialized state in React by using class components. The only argument passed to this hook is the initial state, such as an empty string or array, or even a default dropdown option value (as we see in this tutorial with value="all").

App.js - Coding a text state

The [a, b] pattern consists of an actual value, followed by a function that allows you to change this value. For example, this is how Ed declares a constant useState hook of an empty string:
const [inputText, setInputText] = useState("");

Within our App.js file component (App()), we return multi-line JSX including some basic HTML, as well as our components <Form> and <TodoList>. Within our Form component, we pass our inputText and setInputText state as properties. I was able to better understand this by reading this great article (~10-minute read) on PluralSight.

Form.js - Creating `inputTextHandler`

Ed next shows us how to "arrive to this position" (in reference to our text state in the App.js file). So, we write a function that updates a piece of state within our Form component. He creates functions with the suffix Handler so we know what they do. This one, inputTextHandler, takes one argument as a parameter - the event. To console.log our event as a test, Ed adds an onChange event listener to our <input/> element like so:
<input onChange={inputTextHandler}

Each time our input changes, this function is being ran. The event tells [us] information about what just happened on this input.

Console logging e.target gives us the input element itself, and logging e.target.value prints out exactly what we we enter into the input box, nothing more and nothing less. Great success!

Next, what we do is change the aforementioned state's value.

App.js - Passing down `setInputText()` as a prop

This will be the function that updates the input text. As Ed says, the inputText value will be like "our data/variable that we want to inject". We are then able to access these items by heading back into the Form.js file and passing props as a parameter into our Form component like as you see below:
const Form = (props) => { ... }

A Quick Aside - Destructuring props

Destructuring Props is a simple concept, but it takes some time getting used to. Overall this makes our code more readable and clear, especially when passing down props in React. More on this can be read here in a very straightforward Medium article!. Doing this in our Form component allows us to write code that looks more like this:

const Form = ({ setInputText }) => { setInputText(e.target.value); }

Having state in App.js allows us to use it anywhere in our application. Per Ed,

Every piece of state that you have, data and React automatically updates to everything (as long as you use it in different places), ... and renders it out for us.

A Quick Aside - React Developer Tools

This is a great Chrome extension for the ReactJS library, which allows you to inspect the React component hierarchies in the Chrome Developer Tools. More information on this can be found here! This is great for seeing our state and props, just by hovering of them in DevTools. This includes other data such as hooks!

App.js - Coding a todos state

As implied, this state will be for coding our Todos. Since we will be storing an array of objects (a collection/list of items), Ed instructs us to use an empty array in our hook:
const [todos, setTodos] = useState([]);

The next goal is to submit data and create an object when we do so.

Form.js - Creating `submitTodoHandler`

This function also takes an event argument as a parameter. We begin this function by tackling the issue of the browser window refreshing each time the submit-type <button> is clicked, which is a natural out-of-the-box behavior. Fixing this is super easy:
e.preventDefault();

However, the page refreshing will not be prevented until we add the event handler function via JSX into our <button> attributes:
<button onClick={submitTodoHandler}>

A Quick Aside - JSX

JavaScript XML (JSX) syntax is an extension to the JavaScript language syntax. Their tags have a name, attributes, and children. It transpiles to pure JS. It uses camelCase as a property naming convention, hence such attributes as onClick and className. An example of this information can be viewed here.

Understanding this syntax will help out a lot, in case you run into any confusion during this tutorial. What we are doing above is passing our event handler function submitTodoHandler without the parentheses into our component. I could be mistaken, but based off Googling I believe we are binding our function to the component, so that our context remains the same even though we are passing our function from one object to another, and are doing so from JavaScript syntax to JSX syntax. Our event handlers are passed as properties.

By default you can't access properties, state and component methods like setState from event handlers. To do so, you need to bind them explicitly.

I could be wrong about my interpretation of this. However, the reason why I brought this up is so you, the reader, spent some time understanding that if your event handler is not passed into wherever you use it, it won't work simply by declaring the function above the return value. More information on what I've read can be found here, albeit a little outdated, and here in the React documentation.

Abrupt Conclusion

Sorry

Coding into Nihilism

Jonathan Hammond — Sun, 14 Jul 2019 19:52:21 +0000

This is my first post... and go figure, it's a rant!

I first took interest with "coding" in 2017. I decided that Data Science looked cool, and so I wanted to learn it. Turns out, I didn't learn it easily, especially when I had to teach myself.

Not long after did I stumble upon Python, confusing references to Statistics, sexy words like Machine Learning, Artificial Intelligence, etc. I went from wanting to become a data scientist to being intimidated by how to make a loop.

Nonetheless, I did at least try. I created a program with Python that received input and did a calculation in the background (Just imagine a Daily Caloric Intake Calculator). When 2017 ended, I was a little in the hole due to money I spent on computer devices, books, tutorials, and a lot of cafe hours. I had close to nothing to show for all my efforts.

...

In 2018, I started off with the low-hanging fruit of programming languages: HTML.

I know it's not a programming language, I just wanted to troll you!

Learning Markup was relatively easy (save for what goes on within the head, which partially lead me to SEO and some irrelevant tags), but one thing I noticed was that online resources for HTML 5 and CSS 3 aren't so clear cut, even when they're on a beautiful and perfect website.

HTML 5 has new elements that not everybody uses, which makes it hard to learn what I would compare to the restaurant industry as "mis-en-place" best practices. You begin to do it one way, and the next tutorial dismantles everything you thought was important about header/nav/main/section etc.

CSS has taken me down the most annoying of rabbit holes. First it led me to question whether I wanted to be a developer or a designer. Then it forced me to learn some design despite having decided to become a developer (SVG! Make a logo! Make that photo look exactly how you want it to! Don't give that margin, give THAT margin!).

I am beginning to feel like online tutorials are almost similar to the scammy bootcamps we sometimes hear about. But I am just not one of many who have become competent at coding through these tutorials.

Once CSS led me to Sass and Less and variables that almost made it seem like a programming language, I lost my $h!t. It's like wanting to take up kickboxing to lose weight and tone up the belly, only to spend months watching famous kickboxers and learning the history of a kick before ever really putting a combination together. Well, that isn't a good analogy, because it just wouldn't take that long. I've just gotten lost in the actions of searching, finding, wondering, asking, seeing, repeating, doing, and repeat. I have been more confused than anything, and don't feel the more intelligent because of it all.

...

I've only learned JavaScript in small portions: Codecademy, mmtuts on YouTube, and I'm going to get into it more now on Scrimba and some more YouTube videos.

...

I still don't understand basic things like the DOM,or how to position every element I want as easily as you might on, say, Square Space. It seems like, as soon as I begin to understand a media query, there's just another 100 properties and values and mystery selectors that are required for perfectly responsive web design.

...

It stresses me out, because up until losing my job a few weeks ago (internship for an IT place ended), I had been coding after work hours and on the weekends. It appears that my patience and tendency to get upset and frustrated don't correlate well with the length of tutorials (such as Free Code Camp) or my ability to retain information. I've learned so much, yet when I see the entry level job description, I just get depressed and intimidated. How long until I learn Web pack? AJAX? JSON? Vue.js? Angular.js?

I've heard time and time again the running joke that HR writes the job board description and expects everything plus the kitchen sink out of an intern.

Seriously, who writes these things? Am I the only one who feels so hopeless?

...

Anyway, I know it's just me. I know that the documentation found on websites like MDN is there for anybody to find, but personally I get lost in the lines and confused often. Outside of knowing more about what I don't know, I don't know that much. When I find a template it looks pretty, but it's somebody else's template, not mine. When I build my own website, it looks like 1998 called and wants its style back. When a tutorial subtly slips into asyncronous functions, my ability to reason suggests we apply to work at McDonalds.

...

Why did I get into this in the first place? Well, I wanted to be able to explain complex things to people in a simple fashion. But it turns out I don't understand complex things. Programming makes me feel stupid. Coding anything makes me feel anxious and uncomfortable, save for the few times I've had fun on HTML. I really wish I could go to school for this, because I am starting to consistently doubt my ability to make it on my own as a SWE.

...

In closing, I know why I am failing. How I imagine programming to be, doesn't relate to what it takes to be a programmer. I like the idea of what a programmer does, what it can build, etc. However I don't like reading complex documentation. Furthermore, I hate that other people say it's easy to read, because for them it is. Venturing down this field has led to zero income for me, but more debt and less confidence that I am smart. More worse is that I find it hard to relate to people, because I've mostly only met people who figure it out or fell into the field naturally, or people who want nothing to do with the syntax and concepts altogether.

A lot of me wants to quit, but a lot of me feels too invested. It's not that I don't want to understand programming, it's just that I don't understand programming. I am not going to quit, but I am going to reach into my vindictive energy and learn to spite others. Every bad tutorial, every bad practice, every over-complicated article, each alien piece of documentation, each developer with a brilliant mind but terrible interpersonal skills, to all the g0d d@mn job board descriptions with their expectations so high that it muddies the water of reality, and to all the employers who don't offer any way to train for your position without already having some high-level knack for software development, get bent.

After I get my foot in the door, past an internship, once I'm able to work day to day and accomplish projects demanded by my employer, I am going to help the underprivileged people. I am going to make videos of my own, articles of my own, an SWEAR A LOT. I am going to volunteer at bootcamps, the free ones and not the ones that only cater to the audience of middle-class graduates with BS/MS who have the luxury of taking a year or more off.

I come from an underprivileged background. I grew up through trauma and have had mental health issues. I have participated in sports and competitions such as football and MMA, and have abused alcohol and marijuana and most likely have some degree of brain damage.

I have my limitations, and many shortcomings, but I refuse failure as my final destination. I believe I can learn under the right settings. I will continue to work under whatever settings I can get until I've practiced enough to know enough languages and softwares, concepts and practices to make it to an interview and pass. I will make it. I will MAKE IT. I will do this on my own until I have a community to truly grow in, and then I will excel exponentially and help so many people who are like me and want to quit on their dreams.

To those future people I say, hold on. I will be there soon!