Syntax differences to setting & updating the state.

I am discovering React hooks and the first one I want to dig into is useState. I am trying to understand the magic that lies underneath. I’ll be sharing my basic understanding to clear up my thinking to keep moving forward with future learning.

React has two types of components: class components and function components. When I first learned React, I was told the state can only live in a class component. I was under the impression that functional components were used for more simple tasks such as rendering cards. My basic understanding of the two is that class components…

A quick analysis of their results.

I have worked on a couple of JavaScript Single Page Applications (SPAs). I believe it’s a really fun way to learn frontend development because you get to feel like the master mind behind every single detail. A couple of items that exist is SPAs areinnerHTML and innerText. During my experience in my bootcamp, I just guessed which one to use. Now that I have more time to digest material better, I want to understand the difference between innerHTML and innerText. This blog to clear the basic difference of what the result of both functions are. I plan to create a…

A cheat sheet for beginners or to help transition between Mac & Windows when using VS Code.

I’m transitioning back to a Windows computer after nearly a year of using a Mac. The transition back is not as tough as I thought it would be since I grew up using Windows. However, after going through a coding boot camp with a Mac, I’ve become a big fan of Macs and was doing my best to learn many keyboard commands for efficiency. The Mac keyboard commands, or hotkeys, have some similar patterns to a Windows, but there are still plenty of differences.

I use VS Code to write my programs. Learning hotkeys on the Mac for VS Code…

A cheat sheet to help transition between Mac & Windows terminals.

I’ve learned Ruby, Ruby on Rails, JavaScript, React, git, and more while using a loaned Mac from my bootcamp. Now it’s time to return the my loan and return to my Windows laptop. There are some adjustments for sure. One thing I kept looking for was a nice, concise cheat sheet for terminal commands. I really wanted something to compare against what I already knew on Mac to build my learning through association instead of memorization. So, I’ve made this chart and I hope I can help others who make a switch between Mac and Windows.

Image for post
Image for post

Notice that for *…

Creating a database, tables, and inserting data.

SQL is what allows us to store, retrieve, and manipulate data in database. It stands for Structured Query Language. I will be using SQLite to create a database, tables, and insert data. Here is a link to download SQLite if you’d like.

In the example for this blog, we’ll create a database of animals consisting of two tables. One table will be cats and the other table will be dogs.

SQLite lets us create a database by clicking on “New Database” as seen in the image below.

Creating a Database in SQLite

Image for post
Image for post

The following window will appear.

In my previous blog of Ruby Getters & Setters Methods, I shared what they are, their syntax, and how to use them. Getter and setter methods are great to read and update information, but they can make your code a bit cluttered. Thankfully there is a cleaner way to get and set information using attr_reader, attr_writer, and/or attr_accessor. The code example for this blog will be a continued from the previous blog I mentioned earlier. …

I’ve worked with a few projects with Ruby on Rails, so I thought it would be a good idea to return to the fundamentals of just Ruby. I decided to revisit getter and setter methods. These methods help with retrieving values or creating values for an instance variable. This blog will describe what getters and setters are, their syntax, and an example of how to use them. It’s also assumed that you have an understanding of what a Ruby classes and instances are.

A method that is retrieving a value is getting a value, hence the name getter method. The…

The order of lifecycle methods being invoked.

React is a library that I’ve learned in my bootcamp times and I would like to learn more of its capabilities. One aspect I want to understand with complete confidence is lifecycle methods. The aim of this blog is to understand the order the lifecycle methods are being invoked. Feel free to fork my code to play with the lifecycle methods yourself either along with this blog or after reading.

List of common lifecycle methods

There are many lifecycle methods, but the most common ones are listed below. We will see which methods are invoked when depending on the application.

List of Common Lifecycle Methods

Crazy looking, but crazy useful.

I recently came across Regular Expressions, also referred to as regexp. Here is an example: [a-zA-Z0–9_.+-]+@[a-zA-Z0–9-]+\.[a-zA-Z0–9-.]+. That seems like a hot mess and incredibly intimidating. However, if you enjoy coding, especially the puzzle solving aspect to it, you might enjoy the crazy mess above. Regexps help search for particular data that’s needed, such as emails, phone numbers in a particular format, number patterns, and much more. Regexps can apply to many languages, so the examples shared should apply to most. I’ll be working out of VS Code, but any code editor should be fine.

Here is a youtube video that…

A Comparison Between Syntax & State

I’ve recently discovered React Hooks. I was trying to make them work in Class Components and made myself incredibly confused. Once I realized React Hooks are only used in Functional Components, I was amazed by them. I have plenty more to learn about them, but I wanted to understand some basic differences between Functional and Class Components. Two differences I want to share are syntax and state management.

Note: I've noticed Functional components can be written in ES6 style or classic style. const FunctionalComponent = () => {
return( // This is the ES6 style)
}
.............................OR................................function FunctionalComponent() {…

Linda Ramos

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store