jcasimir

Friendly URLs

By default, Rails applications build URLs based on the primary key -- the id column from the database. Imagine we have a Person model and associated controller. We have a person record for Bob Martin that has id number 6. The URL for his show page would be:

/people/6

But, for aesthetic or SEO purposes, we want Bob's name in the URL. The last segment, the 6 here, is called the "slug". Let's look at a few ways to implement better slugs.

rauchg

Minimum Viable Async with Node 6

With the release of Node 6.0.0, the surface of code that needs transpilation to use ES6 features has been reduced very dramatically.

This is what my current workflow looks like to set up a minimalistic and fast microservice using micro and async + await.

The promise

tiagodealmeida

{
    "countries": {
        "country": [
            {
                "countryCode": "AD",
                "countryName": "Andorra",
                "currencyCode": "EUR",
                "population": "84000",
                "capital": "Andorra la Vella",
                "continentName": "Europe"

gaearon

If you haven’t worked with JavaScript in the last few years, these three points should give you enough knowledge to feel comfortable reading the React documentation:

• We define variables with let and const statements. For the purposes of the React documentation, you can consider them equivalent to var.
• We use the class keyword to define JavaScript classes. There are two things worth remembering about them. Firstly, unlike with objects, you don't need to put commas between class method definitions. Secondly, unlike many other languages with classes, in JavaScript the value of this in a method [depends on how it is called](https://developer.mozilla.org/en-US/docs/Web/Jav

KolbySisk

import { useForm } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import * as z from "zod";

const schema = z.object({
  email: z.string().email().min(2),
  password: z.string().min(6)
});

export default function RhfFormWithZod() {

MadaShindeInai

tRPC: from journeyman to master

What it tRPC?

tPRC is a way for the server and the client to interop and share data and type definitions. Was written to make the relationship between the client and the server as simple as possible similar to graphql.

The path to understanding tRPC (with T3 template in my case):

1. tRPC intro: https://youtu.be/2LYM8gf184U
2. tRPC overview: https://nehalist.io/trpc-review/
3. Create T3 app and try to implement some basic stuff with CSL, SSR and SSG using tRPC react-query, gssp,

gaearon

Next.js client-only SPA example

Made this example to show how to use Next.js router for a 100% SPA (no JS server) app.

You use Next.js router like normally, but don't define getStaticProps and such. Instead you do client-only fetching with swr, react-query, or similar methods.

You can generate HTML fallback for the page if there's something meaningful to show before you "know" the params. (Remember, HTML is static, so it can't respond to dynamic query. But it can be different per route.)

Don't like Next? Here's how to do the same in Gatsby.

devongovett

// Turn all HTML <a> elements into client side router links, no special framework-specific <Link> component necessary!
// Example using the Next.js App Router.
import { useRouter } from 'next/navigation';
import { useEffect } from 'react';

function useLinkHandler() {
  let router = useRouter();

  useEffect(() => {
    let onClick = e => {