DEV Community: Carlos Castaneda

TIL Blog - Mini Project

Carlos Castaneda — Tue, 08 Aug 2023 23:24:15 +0000

For my mini project I decided to take my love of movies and build a movie search app. I was already familiar with TMDB (The Movie Database). The site itself has so much information on movies and tv shows. They also offer an API for free. You just have to create an account and you can request a key. The rate limits are very generous and are roughly 50 requests/sec!

Documentation

TMDB has very well written and organized API documentation that makes it very easy to get the data you need. They even show you how to request data using 20 different programming languages. For Ruby they recommend using the URI gem and the Net/HTTP gem. This is what the code for getting the details for a specific movie looks like using Ruby.

require 'uri'
require 'net/http'

url = URI("https://api.themoviedb.org/3/movie/movie_id?language=en-US")

http = Net::HTTP.new(url.host, url.port)
http.use_ssl = true

request = Net::HTTP::Get.new(url)
request["accept"] = 'application/json'
request["Authorization"] = 'Bearer #{API_ACCESS_TOKEN}'

response = http.request(request)
puts response.read_body

If we plug in movie_id 872585 for Oppenheimer we get back this response:

{
  "adult": false,
  "backdrop_path": "/fm6KqXpk3M2HVveHwCrBSSBaO0V.jpg",
  "belongs_to_collection": null,
  "budget": 100000000,
  "genres": [
    {
      "id": 18,
      "name": "Drama"
    },
    {
      "id": 36,
      "name": "History"
    }
  ],
  "homepage": "http://www.oppenheimermovie.com",
  "id": 872585,
  "imdb_id": "tt15398776",
  "original_language": "en",
  "original_title": "Oppenheimer",
  "overview": "The story of J. Robert Oppenheimer’s role in the development of the atomic bomb during World War II.",
  "popularity": 980.538,
  "poster_path": "/8Gxv8gSFCU0XGDykEGv7zR1n2ua.jpg",
  "production_companies": [
    {
      "id": 9996,
      "logo_path": "/3tvBqYsBhxWeHlu62SIJ1el93O7.png",
      "name": "Syncopy",
      "origin_country": "GB"
    },
    {
      "id": 33,
      "logo_path": "/8lvHyhjr8oUKOOy2dKXoALWKdp0.png",
      "name": "Universal Pictures",
      "origin_country": "US"
    },
    {
      "id": 507,
      "logo_path": "/aRmHe6GWxYMRCQljF75rn2B9Gv8.png",
      "name": "Atlas Entertainment",
      "origin_country": "US"
    }
  ],
  "production_countries": [
    {
      "iso_3166_1": "GB",
      "name": "United Kingdom"
    },
    {
      "iso_3166_1": "US",
      "name": "United States of America"
    }
  ],
  "release_date": "2023-07-19",
  "revenue": 552000000,
  "runtime": 181,
  "spoken_languages": [
    {
      "english_name": "German",
      "iso_639_1": "de",
      "name": "Deutsch"
    },
    {
      "english_name": "English",
      "iso_639_1": "en",
      "name": "English"
    }
  ],
  "status": "Released",
  "tagline": "The world forever changes.",
  "title": "Oppenheimer",
  "video": false,
  "vote_average": 8.299,
  "vote_count": 1599
}

This database provides so much information! They have different endpoints that can provide different info such as:

Credits
Images
Recommendations
Reviews
Videos

and so much more.

My Flix

I decided to name my app 'My Flix' and gave it dark mode look.
I mainly worked on making the site mobile friendly. In the future I would like to add 2 more break points for tablet and desktop views.

Homepage

The homepage is very simple and has 3 clickable links in the header. Clicking the My Flix name will always bring you back to the homepage. The other 2 links I will get to in the next section. Below the header is a simple form with 2 buttons. After you type in a movie title you have the option to select 1 of 2 buttons. The 'Find my movie' button will take you to a new page with the 5 closest titles that match your search. From there you can select the movie you want information on. The "I'm Feeling Lucky!" button will instantly take you to the top result for your search query.

Movie Details

Once you select the movie you want info on, you are presented with some details. The details page provides the following movie info:

title
poster
tagline
overview
release date
runtime
average rating

At the bottom of the details page you have a button that allows you to add the movie to your watchlist.

Watchlist

Finally, the watchlist link will show you a list of any movies that you have added. It will show the title, poster and details button for every movie on your list.

Overall I love how much I learned while building this site. It was great to take everything we have learned over the last few weeks and put it to use. I am a big fan of Sinatra and how easy it makes building sites with different routes. I definitely want to keep adding to the site and making it better. A few things I can add in the future are:

database storage of watchlist instead of cookies
more info on the movie details page such as reviews, trailers and even your own rating of the movie
tablet and desktop views
possibly add an option to search TV shows as well

I am very pleased with how my mini project came out!

TIL Blog Day 10 - View Templates

Carlos Castaneda — Sat, 05 Aug 2023 15:38:15 +0000

Why create view templates?

Before learning about view templates in Sinatra, we had to write our HTML in a String literal. This was problematic because it made our app.rb file really long and hard to read. We also need to escape all the " in our HTML code so it would be valid. View templates makes it so we can separate our HTML from our Ruby code/routes.

To get started:

Create a folder named `views'
In that folder we create a file with the file type .erb
Within that file we can write our HTML (we now get syntax highlighting and emmet is back!)
Finally, to link our Ruby route to this view template we just add a method at the end of our route code like this:

ruby get("/") do erb(:template_name) end

ERB

ERB, or embedded ruby, is a templating language based on Ruby.
It allows you to run Ruby code within your view template and when you run the code the browser only receives pure HTML. The two main tags you will use with ERB are:

<%= %>
Within these brackets you can write the value of a Ruby expression and it will be inserted into your HTML.

<% %>
Within these brackets you can execute Ruby code but it will not be inserted into your HTML.

You can also write your Ruby code in your route and give your view template access to variables by adding an @ in front of your variable names. This will allow you to access them and use them in your erb file.

View templates make it incredibly easy to separate your HTML from your Ruby code. Overall, Sinatra makes it so you can get a website up and running quickly!

TIL Blog Day 9 - Sinatra

Carlos Castaneda — Thu, 03 Aug 2023 19:31:00 +0000

Sinatra

Sinatra is a DSL (domain specific language). This basically means that it is a specialized programming language that is designed for a specific narrow area of tasks. In Sinatra's case, this task is creating web applications. Right from the start, I really liked the simplicity that Sinatra provided when creating a quick web app.

To get Sinatra up and running, first install the sinatra gem and a server gem (puma in this case).
gem install sinatra
gem install puma

After that, you just have to require Sinatra at the top of your Ruby file.
require 'sinatra'

You can know start writing routes by using an HTTP method followed by the route you want to create and the do keyword followed by a block of code.

get '/' do
  "Hello world!"
end

If you run your Ruby file it will output the string "Hello world!" in your browser.

Thats how easy it is to get up and running creating routes with Sinatra. You can quickly start creating your very own CRUD(create-read-update-delete) app!

While it is easy to set up, you can create large and complex web apps with many routes. The possibilities are endless!

TIL Blog Day 8 - Ruby Gym & Codewars

Carlos Castaneda — Fri, 28 Jul 2023 00:12:57 +0000

Over the last few days I got caught up in going through the different Tech Prep modules and I haven’t posted a blog lately.

I recently went through the Ruby Gym module. Overall it was a great experience. It gave me the chance to put into practice all the reading from the Intro to Ruby module. The best way to cement new ideas in your brain is through practice.

After I finished the Ruby Gym module I was still excited to practice my new found Ruby skills. I ended up going to site that I visit daily.

Codewars

Codewars is a great platform to practice your coding skills regardless of the language. They offer 25+ languages that you can train on. Everyone starts with a ranking of 8 kyu. Kyu is a Japanese term used in martial arts to designate proficiency or experience, in Codewars you start at 8 kyu and work your way down to 1 kyu. You get points for solving coding challenges in your language of choice and you also get points for voting on challenges and even creating them. It’s a fun way to track your progress!

I started learning JavaScript last year and I found the challenges on Codewars to be rewarding. You can sort through the challenges and choose specific tags you want to focus on such as fundamentals, arrays, data structures, etc. Some challenges early on are simple and can be done in a few minutes. Other challenges can be complex and have taken me over 40 minutes to complete. I do at least one challenge a day and I’m currently a 3 kyu in JavaScript with over 600 challenges completed.

I recently started doing Ruby challenges and it is a great way to get your spaced repetition after learning new Ruby methods and concepts. If you feel like you could benefit from this platform please check it out!

TIL Blog Day 7 - Intro to Ruby

Carlos Castaneda — Tue, 25 Jul 2023 00:10:57 +0000

Over the course of a few days I worked on and finished the Intro to Ruby module. Overall it was a lot more enjoyable than Codecademy. While Codecademy is definitely a great resource to learn programming basics, I find the content can be a little dry and the site holds your hand too much. The Ruby modules on First Draft were great and it pushed you to think about what you learned when doing the graded code blocks.

I have a little over a year of learning JavaScript so I love to see some of the differences between JS and Ruby. Below are a couple of differences I noticed while working on the modules.

Truthiness and Falsiness

While working through the 'If statements' module i noticed that Ruby has less 'falsy' values compared to JavaScript.
In Ruby, only false and nil are consdered falsy values.

JavaScript on the other hand has the following falsy values.

false
undefined
null
0
-0
On
NaN
""

Equality

Another area were Ruby differs from JavaScript is the equality operator. In Ruby you can only use

== 
!=

In JavaScript you have access to a third equality operator.

!= // not equal to
== // loose equality, equal to but attempts to convert operands that are different types
=== // strict equality, both operands must be same type

Using the == operator can create problems in your code

// The following code returns true
'2' == 2

This can lead to errors in your code, so generally it is recommended to always use the strict equality operator.

While Ruby does have a === operator, it is not used for comparing equality. The === operator in Ruby checks if an object belongs to a class or range. It can be used like this:

(1..10) === 1
# => true

String === 'foo'
# => true

Overall I really like the simplicity of Ruby. It is easy to type and it doesn't have a lot of curly braces and parentheses all over the place like JS.

TIL Blog Day 6 - Ruby Classes

Carlos Castaneda — Wed, 19 Jul 2023 22:27:09 +0000

Today I was able to finish the Codecademy Ruby module. It ended with an introduction to classes in Ruby. Before Tech Prep I had studied JavaScript and that was my only exposure to classes. This previous exposure to classes has provided me with a solid foundation for grasping the intricacies of Ruby's class system.

The biggest difference between Ruby classes and JavaScript classes is that Ruby provides built-in access control for class methods and instance methods using public, private, and protected keywords.

JavaScript, on the other hand, doesn't have built-in access control. Conventionally, developers use naming conventions (like prepending an underscore _) to indicate private members, but these are not strictly enforced by the language itself.

Overall I am liking the simplicity of Ruby. Tomorrow I will tackle the Intro to Ruby modules and keep reading my Ruby book.

TIL Blog Day 5

Carlos Castaneda — Wed, 19 Jul 2023 00:16:22 +0000

Today I worked on the 2nd half of the Codecademy Ruby module. I finished Hashes/Symbols, Refactoring & Blocks/Procs/Lambdas.

I was taking notes as I went through the different sections but it was definitely a lot of information. I plan to go over my notes and quickly scan through the sections again for some spaced repetition. I can't wait to start working on some coding challenges so I can put this new knowledge to the test.

I'm going to finish the day by reading a few more chapters of my Ruby book.

TIL Blog Day 4

Carlos Castaneda — Tue, 18 Jul 2023 00:09:49 +0000

Ruby on Codecademy

Today I started the Ruby module on Codecademy. This is my first exposure to Ruby and I was excited to get started. Ruby would be my 2nd language as I started learning JavaScript in May 2022. While I am not an expert at JS, I have learned a lot over the last year and have done a few projects and hundreds of JS Codewars challenges. I was curious to see how different Ruby is compared to JS.

I went through control flow, loops, arrays/hashes and blocks/sorting. Overall I can see similarities in both languages. The main issue is learning new syntax and conventions. On a few occasions I declared a variable with the let keyword since I am used to that syntax.

Overall I am excited to finish this Codecademy assignment and start working on coding challenges. I really like working on challenges as I find its the best way to really cement the knowledge in your head. I also picked up a highly rated Ruby book called Learning to Program by Chris Pine. Spaced repetition is one of the best ways to learn new things. I love to learn on the computer as well as sitting down and reading a book.

TIL Blog Day 3

Carlos Castaneda — Sun, 16 Jul 2023 16:57:33 +0000

Link in Bio

Today I started working on the 'Link in Bio' assignment. I began by creating the basic structure of the app and adding all my social media account links. For the links below that, I decided to create a developer 'toolbelt' with helpful links. These are a few sites that I still go to when I have questions and am looking for a quick refresher.

Link 1

The Mozilla Developer Network, or MDN for short, is the go to website for web developers. Any questions concerning HTML, CSS and JavaScript can be answered by searching this vast site. It is an indispensable tool in web dev.

Link 2

This link is a visual guide to CSS. It has a list of 100+ CSS properties. When you click on a property it gives you a short description of the property and then gives you a few examples of how to use the property.

Link 3

This link is very well known and is a great resource to have handy when working with Flexbox. It is a visual guide that explains the different properties of Flex and how they work.

Link 4

If you want your website or project to have a unique feel you need to change the default fonts. Google Fonts gives you access to hundreds of free to use fonts. You do a quick search and when you find the font you like you click on it and select the different styles you want(italic, bold, light, etc). You can either download the fonts and manually add them to your project or you can use the provided link and embed the font using the link tag in the head of your html document.

Link 5

The last link is a site that helps you learn basic command line commands. When I first started learning Git I struggled using the CLI (command line interface). This site helped me learn a lot of different commands to navigate my folder structure. It can be a bit overwhelming at first but it is very beneficial to learn the basics of the command line.

So those are the 5 links I chose to add to my 'Link in Bio' assignment. I hope that you guys find them useful!

TIL Blog Day 2

Carlos Castaneda — Sat, 15 Jul 2023 02:15:56 +0000

Day 2 of Tech Prep went well. Today I worked on Raghu's HTML review. I have done the Codecademy HTML and CSS modules in the past but its always good to get a refresher.

The review was very helpful and went over some basic HTML elements and how they work. I think the main takeaway from the HTML review was the difference between inline and block elements.

Along with the HTMl review, we also got a quick refresher on CSS and the Box model. The final portion of the CSS section was an overview on Flexbox and a link to Flexbox Froggy which is a helpful utility that helps you understand Flexbox syntax with a quick, fun game.

If anyone is looking for more Flexbox practice, be sure to check out Flexbox Zombies here.

TIL Blog Day 1

Carlos Castaneda — Thu, 13 Jul 2023 23:28:40 +0000

Today I worked on the 'Getting Started' module of the Tech Prep course.

I'm excited to start using the 'Ask' question forum. I'm sure that it will be an indispensable tool as we progress through Tech Prep and hopefully the fall program/bootcamp. I have used ChatGPT in the past whenever I ran into issues with writing JavaScript code and it has helped tremendously.

I was also able to complete the 'Hello, World!' module today.
It was great to learn how to use Github Codespaces and deploying a simple page to the internet. In the past I have used Github Pages and Netlify so it's good to learn about another service like Fly.io

I'm extremely grateful and excited to participate in Tech Prep. While I do have some experience with JavaScript, I am looking forward to adding Ruby and Ruby on Rails to my tool belt.

Lastly, one last comment to anyone reading this. Definitely take breaks from coding. It can be tempting to grind away for hours without a break but I have found the stepping away from the computer when you are stumped/tired is a great way to clear your mind. When you come back you will feel even better and can continue coding feeling refreshed. I try to stick to the Pomodoro technique(25 minutes of work, 5 minute break, repeat) and have had great success with it!