DEV Community: Ricardo Maya

Getting to know JAVA

Ricardo Maya — Mon, 24 Jul 2023 23:26:32 +0000

I have recently been accepted to a full-stack developer apprenticeship. Although I am excited about this awesome opportunity, I am equally as nervous because I will be undergoing some rigorous training with a completely different stack than I'm used to, starting with Java.

I am currently trying to get ahead of the curve by learning some Java fundamentals with Codecademy.

TIL

Today I learned about:

Classes
Print Statements
Compilation
Javadoc Comments

Classes

I understand classes to be abstracted pieces of code.
The part of classes that I need to be more comfortable with is writing the full defining syntax.

public class myClass {
  public static void main(String[] args) {

  }
}

I haven't looked into it yet but, I'm hoping that working on Java code with an IDE will auto write things like this.

Print Statments

I am used to using console.log in Javascript and print/puts in Ruby and also return to display data or information but Java uses System.out.println and System.out.print and each has a subtle difference.

System.out.println() - will print to the console and then create a new line.
System.out.print() - will print everything on the same line.

Compilation

The compiling process catches mistakes before the computer runs our code.

Java is a compiled programming language. Although, Codecademy has automatically compiled and run the files for me, I was also able to compile and execute some files myself.

To compile a file, first use the terminal command:
javac FileName.java

A successful compilation produces a .class file (FileName.class).

Afterwards, to execute it, use the terminal command:
java FileName

An unsuccessful compilation should produce a list of errors.

Comments

Apart from the usual suspects (single and multi-line comments) Java also has another comment called Javadoc comments.

A Javadoc comment is represented by using the (/)** and (*/) symbols.

They are used to create documentation for APIs. When writing Javadoc comments, its important to remember that htey will eventually be used in the documentation that your users might read so it's important to make sure to be especially thoughtful when writing these comments.

These comments are typically written before the declaration of fields, methods, and classes.

I am excited to continue learning more and will do my best to keep documenting my progress.

Environment variables - Webstorm & Nodemon

Ricardo Maya — Mon, 04 Oct 2021 19:40:30 +0000

When creating an app, it is important to create environment variables. In my current project, I am using Webstorm as my ide and the nodemon npm package for my server as well as the passport google Strategy.

Passport is authentication middleware for Node.js. Extremely flexible and modular, a Passport can be unobtrusively dropped into any Express-based web application. A comprehensive set of strategies support authentication using a username and password, Facebook, Twitter, and more.

When using Google as an authenticator, or any 3rd party api, there is a process to create credentials for your app (Client ID, Secret). Once you have those credentials, it's important to keep them secret, keep them safe. In order to do so, there is a method most people use and that is to create environment variables.

An environment variable is a variable whose value is set outside the program, typically through functionality built into the operating system or microservice. An environment variable is made up of a name/value pair, and any number may be created and available for reference at a point in time.

Nodemon is a utility depended on by over 1.5 million projects, that will monitor for any changes in your source and automatically restart your server.

In my project I kept coming up with errors in my google Strategy. The environment variables were not being read.

Creating variables in webstorm, as opposed to sublime or maybe atom, is very different. In either of the latter text editors I mentioned you could simply create a .env file where you would store these important variables. Also installing the dotenv npm package to be able to use these variables is necessary.

Dotenv Dotenv is a zero-dependency module that loads environment variables from a .env file into process.env.

This is where it would get confusing. In webstorm, you can influence the runtime behavior of your app by adding program arguments and environment variables to run/debug configurations.

Add environment variables

From the main menu, select Run | Edit Configurations or choose Edit Configurations from the run/debug configurations selector on the toolbar.
In the Run/Debug Configurations dialog, select a configuration you want to add the environment variables to.
Type the variable name and value: =. If you add several variables, they should be separated with semicolons.

Alternatively, click the Environment
variables icon and add the variable name and value to the User environment variables list.

This will work but just don't forget to click the apply button once done! Also, this will only work when running your app through the ide (not using nodemon).

When using nodemon to run the app, and trying to set environment variables by using the ide's configurations, the env variables will not be read. Instead this is where the dotenv npm package and a .env file comes into play.

According to a post on the JetBrains Hub, "Variables you have defined in run configuration are only available in runtime, they can't be resolved during static code analysis"

Create a .env file in the root directory of your app. Place your variables inside this file as such:

VARIABLE_NAME=VARIABLE_INFORMATION

Next, it's important to require the dotenv package as soon as possible. In my experience it is always on line 1 of my main file (app.js, index.js, etc.).

Now that you have your env variables set in the env file, don't forget to set the .env file in your .gitignore file, you can run nodemon and the variables will be read.

Plan of Attack

Ricardo Maya — Mon, 22 Feb 2021 19:11:29 +0000

// PSEUDOCODE
//input
List of numbers

Sort the numbers in the list so that they’re in order.
Loop through the list to leave out a number in the list
Then add the remaining numbers to get the sum
Place all of the sums in a separate array
Filter the new sum array to identify the min and max sum’s

//output
Min and max sum of the list of numbers

This is pseudocode from a hackerrank challenge I was working on with a couple of cool cats from the coding community I joined. Pseudocode, for those who don't know, is a methodology to represent the implementation of an algorithm. In this session, I really learned the importance and aid of pseudocoding. In the words of one of my friends Rashad, "It's good to use pseudocode. Your code start's to flow better."

This was very true and I struggled for a long time on how to properly use pseudocode. A really great tip he gave me was first, to start with the input & output of what you're trying to achieve. Afterward, you only have to fill in the middle. Being rather specific was important in detailing what your pseudocode entails. Another small but important detail was in the order of placing the input and output. This small detail helped me see, even clearer, how useful pseudocoding was.

By placing the input, the data that the algorithm is manipulating, at the top of my pseudocode, then placing the output at the bottom and writing the details of what the algorithm will be doing in the middle. This gave my pseudocode the structure of an actual function. Afterward, it was just a matter of plugging in and deciding which methods needed to be used to achieve what it was I was trying to achieve.

When quitting is ok

Ricardo Maya — Mon, 11 Jan 2021 22:38:32 +0000

I recently finished a month-long project I had been working on. The project was to create an Instagram clone in order to put into practice the knowledge I had gained so far in the React framework. It seemed instantly intimidating and basically impossible but I kept hope. I had help from friends and mentors and finally completed it.

I started this project amidst learning React's basics and working on practice problems. These problems consisted of created basic components that would render a basic button and create a simple function once the button was pressed. The last one I was working on was called roulette gun. Roulette gun rendered a statement inviting you to play by pressing the button. Once the button was pressed, a method would be activated in which the new statement now said, "spinning the chamber and pulling the trigger...". The component took in a prop with the number 8 so when the button was pressed there was also a random number generated from 1-8. If the randomly generated number equaled the given prop number then the statement will now read "BANG!!!!" otherwise it will display "you're safe!".

I couldn't understand exactly how to make this all work at first so I quit. I quit the problem and started on a new endeavor which was creating a clone of Instagram. Trust me I know that seems sort of backward but, I must say that it was the best decision I made. I spent a month sort of pulling my hair on how to figure things out. If it wasn't for my mentor, and friends and the results I was seeing while completing the project piece by piece (Bootstrap helped a lot as well) I would have probably given up on it as well.

While figuring things out I could notice myself understanding the flow of the code a bit more each time. Once I completed the clone, my confidence grew as well. I went back to the roulette gun problem and, with the new gained knowledge and confidence, I was able to see where I was going wrong, correct it and add a whole conditional for what happens when the button is pressed.

All this to say that sometimes it is ok to quit on something like a personal project. Take some time, gain new knowledge or develop what's already there, and then come back to it and pull that trigger.

Typos are a bctih

Ricardo Maya — Sat, 19 Dec 2020 22:20:12 +0000

Errors, when programming, are a dime a dozen. It can be frustrating when you're unsure why the error is showing up in the first place. Was it because the usage of a certain variable was incorrect? Maybe I didn't import anything? Do I just not understand how to use this method correctly? The possibilities could be many and trying to find what went wrong is very similar to trying to find Waldo in a "Where's Waldo?" book.

It is exceptionally annoying when you figure out that the cause of all your headaches and misery is a simple typo.

I am in the process of creating an Instagram clone as a personal project to use in my portfolio/resume. I was passing data from a JSON file to be used by different React components. While mapping the data in my PostIndex component I set the variables in camelCase

imageUrl={this.props.image_url}
userName={this.props.username}
caption={this.props.caption}

Then, when setting the data to use in my modal component, I couldn't understand why the data was not passing

<Card.Title>{props.userName}</Card.Title>

Lo and behold! when setting the variables to be used for my modal, I needed the names to be spelled the same! Once I fixed this issue

all became right in the world again.

Breaking-down & Building-up

Ricardo Maya — Sat, 12 Dec 2020 23:06:06 +0000

“Wisdom is not a product of schooling but of the lifelong attempt to acquire it.” -Albert Einstein

I've started to work on a project with a friend and mentor of mine. We're using Trello to keep track of the progress, and details of the tasks on hand. So far it feels great using Trello! I have tasks to complete and being able to see the details of those tasks helps to keep me focused on what to do next with a sense of direction and purpose.

I received a lot of great advice on my last post about breaking things down " down to the point of almost trivial " as one person put it and so far, taking each task and completing it detail by detail, has helped immensely in my progress.

I'm getting stuck in some places where I feel like I shouldn't and, so far most of the work has been on building the skeleton for the project but, I'm more optimistic. I have a great network of support and since joining Dev.to and reading other people's blogs about their journeys or what they've discovered has only enhanced that feeling. I look forward to getting unstuck some more.

todo, blog

Ricardo Maya — Mon, 07 Dec 2020 18:13:31 +0000

“Our greatest weakness lies in giving up. The most certain way to succeed is always to try just one more time.”
-Thomas A. Edison

Here is the place I am currently at. Feeling a bit lost and distraught. Although I have read a lot of documentation and watched tutorial videos, when it comes down to "freehand" writing my code to create something, I feel like the person in the image, standing at the entrance of the daunting maze.

Still, I understand that this is part of the process and my determination refuses to let me cave in and see this project through.

I started late and decided to try something "simple" like a to-do list. As a consequence of starting so late, my to-do list transitioned into a blog application. I've added React bootstrap to add styling and utilize the components. I have created a card so far complete with an image and a brief description of the post's main idea. I've also added a button that I want to give the function of expanding the full post. I'm not exactly sure how to do this so far but I am determined to succeed somehow.

Creating a Job list in React

Ricardo Maya — Wed, 02 Dec 2020 19:50:12 +0000

In my continued learnings on using React, I decided to follow a tutorial on how to make a job list. I am at the point where I know I need to lay off tutorials but, as a novice in React and programming in general, I find myself to be overwhelmed and intimidated when trying to do things on my own. So, when I decide to google "how to start" I end up following the full tutorial.

Anywho! This job list comes complete with a submit and delete button to edit the list of names. It uses the state of the App component, which is just an empty characters array object, to save the input data.

The way to input and save this data comes from the handleSubmit method created in the parent App component. What this method does is add a character to the list of characters once the submit button has been clicked. That gets passed into the Form component as a prop.

Now, in the render method of the Form component, a submit button is added with an onClick prop that calls back to the submitForm method created in the same file that calls back to the _handleSubmit method and passes the Form state through as the character parameter. Afterward, it is reset to its initial state to clear the form after submit.

Initial Post

Ricardo Maya — Tue, 01 Dec 2020 19:02:41 +0000

As my first post, I figure I give a little background about where I've been and where I'm trying to go.

I have been trying to make the career switch into web development for the past couple of years now with minimal luck. I started this path when I reconnected with an old friend who told me his story about how he was able to transition into a full-stack developer role.

His story was inspiring and in some cases similar to my own. After hearing about the different aspects of a developer's life and, considering my first experiences with any type of coding was changing color schemes and adding music players to my old Facebook page which I genuinely enjoyed, I decided that maybe this would be my future.

After joining the coding community of which he and a few others started to help people like myself who wanted to make the change to being a web developer I began learning from free coding sources like Codecademy, Online courses from Udemy and Udacity. Eventually, I joined a Google scholarship program from which I graduated and got a certificate.

Fast forward to now and I have been able to work on a few freelance projects and even joined a coding boot camp for front-end web development. I am currently still on track with that boot camp and learning the fundamentals of the React framework.