Expert Web Development using React JS, Rails & Elixir

giritharan

Fri May 10 2024

Dup vs clone while dealing with Active Record:
• Dup creates a new record with a blank ID, which will create a new object on the database with a new ID after hitting .save.


user = User.first
user1 = user.dup
user1:
<User id: nil, name: "Rails">

• clone creates a new record with the same ID, after hitting save on the clone object this will overwrite the existing data.


user = User.first
user1 = user.clone
<User id: 1, name: "Rails">

• If you change some value on the above attribute and put .save it will overwrite the original obj.
#dupvsclone #ruby #rails

syedsibtain

Thu May 09 2024

In Rails, the resources method provides a convenient way to define RESTful routes for our application's resources. Instead of manually specifying separate routes for each CRUD action (Create, Read, Update, Delete), we can use the resources method to define all these routes with a single line of code.


# config/routes.rb

Rails.application.routes.draw do
  resources :students
end

With this single line of code, Rails automatically generates the following RESTful routes for the students resource:


GET     /students          # Index action (display a list of students)
GET     /students/new      # New action (display a form to create a new student)
POST    /students          # Create action (create a new student)
GET     /students/:id      # Show action (display details of a specific student)
GET     /students/:id/edit # Edit action (display a form to edit a specific student)
PATCH   /students/:id      # Update action (update a specific student)
PUT     /students/:id      # Update action (update a specific student)
DELETE  /students/:id      # Destroy action (delete a specific student)

#rails #routes

syedsibtain

Thu May 09 2024

In a Rails application, the seeds.rb file is used to populate the database with initial data. This file typically resides in the db directory of our Rails application. The data added through the seeds.rb file is often used for testing or for providing initial data in a fresh installation of the application.

After defining the data in the seeds.rb file, we can populate the database by running the rails db:seed
#rails #database

giritharan

Wed May 08 2024

Generic Classes:

• To ensure that the function correctly infers the type of the argument passed to it and returns the same type, you can use TypeScript's generic type notation


function identityType<Type>(prop: Type): Type {
  return prop;
}
identityType(1);

• If we plan to use generic <> have to add, it tells ts compiler as the function in generic fn.
• From the above code we can see the example, if we planned to use string we can or boolean we can. The thing is both prop and return type has to be similar
#typescript #javascript

giritharan

Wed May 08 2024

Difference between any and unkown type in ts
any:
- The any type is a dynamic type, variables of type any can hold values of any data type, and TypeScript type checking is effectively turned off for them.
- While any provides flexibility, it bypasses TypeScript's type checking entirely, which can lead to loss of type safety and potentially introduce bugs.

unknown:
- The unknown type is a type-safe counterpart of any. It represents values of an unknown type.
- Variables of type unknown can hold values of any type, but you cannot perform operations on them without first narrowing their type or asserting a more specific type.

Both any and unknown provide flexibility in handling values of unknown types, any completely disables type checking, while unknown enforces type safety by requiring you to explicitly narrow the type before performing operations on the value. It's generally recommended to prefer unknown over any when dealing with values of unknown types, as it helps maintain type safety in your TypeScript code.

#typescipt #javascipt

giritharan

Wed May 08 2024

Classes And Functions in Ts.
Classes:
• Ts add helps to add type annotations for the classes.


class User {
  constructor(public name: string, public age: number) {}
}
const ue = new User("github", 24);

• In Ts we don't need to initialize the properties and values inside the constructor if we are using access modifiers in the params. TypeScript will automatically initialise and assign values to class properties.
Getters / Setters:
• Classes can also have accessors
• For the getter function we can able to set return value type but for setter function we can't.
• setter functions are always expected props.
• If a getter exists but no setter the property is automatically readonly
• If the type of the setter parameter is not specified, it is inferred from the return type of the getter
• For class props always try to use _ name convention for better maintainbility.


class User {
  private _currentCount: number = 0;
  constructor(public name: string, public age: number) {}

  get fetch_name(): string {
    return this._name;
  }

  get fetchCount(): number {
    return this._currentCount;
  }

  set increaseCount(prop: number) {
    this._currentCount = prop + this._currentCount;
    this.logData();
  }

  private logData(): void {
    console.log("Count Increased");
  }
}

const fetchUser = new User("github", 24);

Abstract:
• If classes or method are marked as abstract those are only for readonly purposes, means they can be only used as base class/sub class.
• So that reason we can't create object on the class who are marked as abstract.


abstract class Photo {
  constructor(public isCameraOn: boolean, public isFlashOn: boolean) {}
}

class Phone extends Photo {}
const ph = new Phone(true, true);

#typescript #javascript

giritharan

Tue May 07 2024

Typescript Learning

Variable definition:
In Typescript we can specify the type string, number and boolean like


    let myName: string = "Vijay";
    let age: number = 20;
    let isActive: boolean = false;

Moreover, if we don't specify the type typescript automatically detects the type by itself. But end of the defining the type was a good convention.

Function Definition:
• For defining a function we can specify the function parameters type. Along with that we can able to set the default value. And also the return value.


    function sum(a: number, b: number = 2): number {
        return a + b;
    }

• For Arrow function:


let sum = (a: number, b: number = 2): number => a + b;

Why don't use any :
• Using any in TypeScript bypasses type checking but undermines TypeScript's static typing advantages. It's better to specify types explicitly for safer and more maintainable code.
Array:
With the help of the array, we can store number, string and boolean values separately and mixed.


For String
 let users: string[] = ["a", "b", "c", "d]

For Number
 let count: number[] = [1, 2, 3, 4]

For boolean
let isActive: boolean[] = [true, false]

For Mixed array
 let allDate: (string | number)[] = ["a", "b", "c", 1]
 Here Array contains only integers and strings

Void And Never:
• void is a type that represents the absence of returning value. It's often used as the return type of function that doesn't return any value.


function logError(msg: string): void {
    console.log(msg);
}

• never represents the type of values that never occur:. It's typically used as the return type of functions that never return (i.e., always throw an error).


function throwError(message: string): never {
    throw new Error(message);
}

Object Type:
• Object Types is used to pass the object as a parameter in the functions.


function fetchData(pt: { x: number; y: number }) {
  return pt;
}
fetchData({ x: 3, y: 7 });

• If we want mentioned as an optional prop we can do that with the help of ? operator


function fetchData(pt: { x: number; y?: number }) {
  return pt;
}
fetchData({ x: 3 });

Union Types:
• It means type can be formed in two or more types, which means values can be anything from the union value.


  function sum(a: string | number) {
        return a;
    }
Here you can see value can be anything string or number

Type Aliases
• When can use both object type and union type but if we want use more than once we can use Type Aliases or Interface .


type User = {
  name: string;
  age: number;
}

function displayUser(prop: User) {
  console.log(prop.name);
  console.log(prop.age);
}

displayUser({name: 'John', age: 22})

• Moreover on the type, we can able to do extend the values.


type User = {
  name: string;
  age: number;
}

type Role = {
  role: string
}

type UserDeatils = User & Role & {
  address: string;
}

• From above you can see that the userDetails inherits the user and role props without adding extra value. So that helps to keep DRY over time.
Interface:
• Interface is also similar in concept to type._ it's another way to name an object type.

interface User { name: string; age: number; } function displayUser(prop: User) { console.log(prop.name); console.log(prop.age); } displayUser({name: 'John', age: 22})

• It allows the extending feature.

interface User { name: string; age: number; } interface Role { role: string } interface userDetails extends User, Role { address: string; }

• The Only difference is type not available for re-opening for adding new properties.
Readonly and Optional:
• with the help of that, we can mark the value as read-only or optional.

type User = { readonly id: string; name: string; phone: number; isActive: boolean; email?: string; };

• If we try to access id typescript will throw an exception. Also, email is not present on obj it does not make exceptions.
Tuples:
• Tuples are a data structure that allows you to store a fixed-size, ordered collection of elements.
• Each element in a tuple may have a different data type. They are similar to arrays, but their size and types are fixed once they are defined.

let myTuple: [string, number, boolean]; myTuple = ['hello', 10, true];

• In typles we can modify elements of the tuple using array method with different types. It doesn't show any warning we always need to be aware of it.
Enums:
• Enums in TypeScript are usually _used to represent a determined number of options for a given value.
• TypeScript provides both numeric and string-based enums
• Numeric enums:
▪︎ By default enum value starts from 0 until we explicitly mention something:


const enum UserType {
  ADMIN,
  USER,
  GUEST,
}

• We can explicitly change the enum value


const enum UserType {
  ADMIN = 10,
  USER,
  GUEST,
}

• so from now value goes like 11, 12 in upstream
• String enums:
◦ String enums are similar to numbers, But here we can specify string instead of numeric


const enum UserType {
  ADMIN = "admin",
  USER = "user",
  GUEST = "guest",
}

• Heterogeneous enums:
◦ We can mix up string and numeric on enum. But After string, if numeric get started we need to mention the numeric value for the first one.


const enum UserType {
  ADMIN = "admin",
  USER = 0,
  GUEST,
}

• Remaining value can typescript will handles.
#typescript #javascript

syedsibtain

Tue May 07 2024

In Rails, a partial is a reusable view template that allows you to encapsulate a portion of a view into a separate file. Partials are useful for organising and reusing code, especially when certain components or elements are repeated across multiple views within an application.

We can create a partial by creating a new file with a name that begins with an underscore (_). For example, _sidebar.html.erb or _header.html.erb.

And to render a partial within another view, use the render method with the name of the partial file (without the underscore) as an argument. For example, <%= render 'sidebar' %> will render the _sidebar.html.erb partial within the current view.

#rails

syedsibtain

Thu May 02 2024

The rails routes command generates a comprehensive list of all routes defined in our Rails application, displaying the HTTP method, URL pattern, controller, and action associated with each route.

#rails

satya

Mon Apr 29 2024

find your rails code smells by using a gem called flog . Flog finds the most tortured code in your codebase.


gem install flog

then run


flog app lib

it will print the flog score for the all files that has score more than or equal to 10. Generally we should make sure flog score should be less than 10.
Note: The more the flog score , the more pain the code is in.
#rails #code-smells #flog

Showing 13 to 15 of 71 results