Forem: Dylan Rhinehart

Ruby On Rails : Encryption With BCrypt

Dylan Rhinehart — Mon, 06 Mar 2023 07:51:21 +0000

Keeping user data safe is crucial when developing web applications. In Ruby on Rails, bcrypt is a built-in gem that lets developers secure their applications by encrypting passwords. In this blog, we'll talk about how to use bcrypt in Ruby on Rails to beef up your app's security.

What is bcrypt?

Bcrypt is a password hashing function that uses a salted key derivation function to secure passwords. It's designed to be slow and computationally expensive, making it difficult for attackers to perform brute-force attacks on hashed passwords. Bcrypt is widely used in web applications to store and authenticate user passwords.

Using Bcrypt in Ruby on Rails

To get started with bcrypt, you need to add the bcrypt gem to your Rails application by adding this line to your Gemfile:

gem 'bcrypt'

After adding the bcrypt gem to your application, you can use it to hash user passwords by calling the bcrypt method in your Rails model. For example, say you have a User model with an email and password field. To hash the password before saving it to the database, you can use this code:

class User < ApplicationRecord
  has_secure_password
end

The has_secure_password method automatically hashes and stores the password in the database when a new user is created.

To authenticate users, you can use the authenticate method provided by the has_secure_password method. For example, say you have a SessionsController that handles user authentication. You can authenticate a user by checking their email and password against the hashed password in the database like so:

class SessionsController < ApplicationController
  def create
    user = User.find_by(email: params[:email])
    if user && user.authenticate(params[:password])
      # User is authenticated
    else
      # Authentication failed
    end
  end
end

The authenticate method checks the provided password against the hashed password stored in the database. If the passwords match, the user is authenticated.

Conclusion

Using bcrypt is a powerful way to secure your Ruby on Rails web application. It protects your users' data from attackers and reduces the risk of data breaches. The has_secure_password method provided by Rails makes it easy to use bcrypt in your application. This lets you focus on other aspects of your app while keeping your users' data safe.

An Introduction to Classes in Ruby: A Guide to Object-Oriented Programming

Dylan Rhinehart — Mon, 13 Feb 2023 15:04:10 +0000

Ruby is an object-oriented programming language, and classes play a crucial role in this paradigm. A class is a blueprint that defines objects and their behavior. In this article, we'll dive into the basics of classes in Ruby and how they can help you organize and manage your code.

To start, let's take a look at a simple class in Ruby:

class Dog
  def initialize(name, breed)
    @name = name
    @breed = breed
  end

  def bark
    puts "Woof!"
  end
end

Here, we've created a class called Dog with two attributes: name and breed. The initialize method is a special method that is called when a new instance of the class is created. This is where you can set the initial state for the object. In our example, we are setting the name and breed attributes when a new Dog instance is created.

Creating an instance of the class is simple. Just use the following code:

dog = Dog.new("Fido", "Labrador")

And to call the bark method on the dog object, use the following code:

dog.bark
# Output: Woof!

In addition to the initialize method, Ruby has other special methods that make it easy to define getters and setters for class attributes. For example, you can use attr_reader, attr_writer, and attr_accessor to access and modify the state of an object.

Here's an example of using attr_reader and attr_writer:

class Dog
  attr_reader :name
  attr_writer :breed

  def initialize(name, breed)
    @name = name
    @breed = breed
  end

  def bark
    puts "Woof!"
  end
end

With attr_reader and attr_writer, you can access the name and breed attributes directly:

dog = Dog.new("Fido", "Labrador")
puts dog.name
# Output: Fido

puts dog.breed
# Output: Labrador

dog.breed = "Golden Retriever"
puts dog.breed
# Output: Golden Retriever

And if you want both getter and setter methods, you can use attr_accessor:

class Dog
  attr_accessor :name, :breed

  def initialize(name, breed)
    @name = name
    @breed = breed
  end

  def bark
    puts "Woof!"
  end
end

These are the basics of classes in Ruby, but they will give you a solid foundation to build upon. By using classes in your Ruby programs, you'll be able to create objects, manage their state, and define their behavior, making your code easier to organize and maintain.

Creating a CRUD Application with React: Mastering useState and useEffect

Dylan Rhinehart — Thu, 19 Jan 2023 17:09:17 +0000

CRUD, which stands for Create, Read, Update, and Delete, is a fundamental aspect of any web application. In this blog post, we will explore how to implement the CRUD operations using React's useState and useEffect hooks. These hooks allow us to manage state and side effects in functional components, making our code more readable and maintainable.

We will start by using useState to create a state variable for our data, which will be an array of items. We will also create a setter function to update the state, which will be used to add, edit, and delete items from the array.

import { useState, useEffect } from 'react';

function MyComponent() {
  const [items, setItems] = useState([]);

  const addItem = (item) => {
    setItems([...items, item]);
  }

  const editItem = (index, item) => {
    const newItems = [...items];
    newItems[index] = item;
    setItems(newItems);
  }

  const deleteItem = (index) => {
    const newItems = [...items];
    newItems.splice(index, 1);
    setItems(newItems);
  }

  return (
    <div>
      <button onClick={() => addItem({ name: "New Item" })}>Add Item</button>
      <table>
        <tbody>
          {items.map((item, index) => (
            <tr key={item.name}>
              <td>{item.name}</td>
              <td>
                <button onClick={() => editItem(index, { name: "Edited Item" })}>Edit</button>
                <button onClick={() => deleteItem(index)}>Delete</button>
              </td>
            </tr>
          ))}
        </tbody>
      </table>
    </div>
  );
}

In the above example, we have created 3 functions addItem, editItem, and deleteItem which will update the state of the items. In the render function, we have mapped through the items and displayed them in a table. We have also added buttons to edit and delete items.

Next, we will use useEffect to fetch data from an API and update our state. useEffect takes two arguments: a function that will run when the component is rendered, and an array of dependencies, which determine when the effect should be run. In this case, we want to fetch data when the component is first rendered, so we will pass an empty array as the second argument.

import { useState, useEffect } from 'react';

function MyComponent() {
  const [items, setItems] = useState([]);

  useEffect(() => {
    fetch('https://my-api.com/items')
      .then(response => response.json())
      .then(data => setItems(data))
  }, []);

  // ...rest of the component remains the same

}

In the example above, when the component is first rendered, the useEffect function will run and fetch data from the API. It will then update the state with the data

DOM Manipulation Basics: Vanilla JS

Dylan Rhinehart — Thu, 22 Dec 2022 18:16:51 +0000

The Document Object Model (DOM) is an essential part of web development, and JavaScript allows us to manipulate the DOM in powerful ways. The DOM is a tree-like structure that represents the HTML of a web page, and by using JavaScript, we can add, remove, and modify elements in the DOM to create dynamic and interactive web pages.

One common way to manipulate the DOM is through the document object, which is a global object in JavaScript that represents the HTML document. Using the document object, we can select elements on the page, access their properties, and modify their content or style.

For example, to select an element by its unique ID, we can use the document.getElementById method:

const element = document.getElementById('my-element');

You can also use document.querySelector method, this method can prove more useful at times.

//To get an element by ID
const element = document.querySelector('#my-element-id');

//To get an element by Class
const element = document.querySelector('.my-element-class');

Note the difference between ID and Class. To find an ID you must use '#myId'. To find a Class you must use '.myClass'.

Once we have selected an element, we can modify its content using the innerHTML property:

element.innerHTML = 'Hello, world!';

We can also modify the style of an element using the style property:

element.style.color = 'red';

In addition to these basic techniques, we can use methods such as createElement and appendChild to add new elements to the DOM, and removeChild to remove elements.

element.createElement("div");
element.appendChild(aChild);
element.removeChild(aChild);

Overall, the DOM is a powerful tool for interacting with web pages, and learning to manipulate it is an important part of becoming a proficient JavaScript developer. Whether we are building simple websites or complex applications, the ability to manipulate the DOM is an essential skill that every JavaScript developer should have in their toolkit.

Sources:
MDN