mwood23

{
      "rules": {
        "no-restricted-imports": [
          "error",
          {
            "paths": [
              {
                "name": "next/router",
                "message": "Not universal. Use solito/router instead."
              },

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.

hirbod

How to Successfully Publish Your App on the App Store or Google Play

As someone who has released many apps starting in 2015 using frameworks such as Cordova and Ionic, and more recently using React Native and Expo, I have learned that the rules for publishing apps can change frequently and can sometimes be challenging to navigate. With that in mind, I want to provide a brief guide to help others navigate the process. While this guide may not cover every aspect of publishing an app, it does cover general tips and information that should be useful for anyone looking to release their app on the App Store or Google Play.

Metadata

Keywords, Description, Screenshots, App Name, Promo Videos

There are significant differences between Apple and Google when it comes to metadata. Apple is generally stricter than Google, so it is advisable to follow Apple's guidelines to ensure the best chances of success on both platforms. Here are some tips to keep in mind:

1. Keep your screenshots and promo videos separat

horacioh

Frontend Testing

In mintter we have currently 3 types of testing:

1. Static type testing with Typescript
2. Unit testing functions with vitest
3. UI testing with Cypress

Run tests locally

Slooowpoke

/* eslint-disable no-param-reassign */
import {
  getMembers, types
} from 'mobx-state-tree'
import {
  createMachine
} from 'xstate'
import { interpret } from 'xstate/lib/interpreter'

// Pieced together from:

kapiljhajhria

Integrate Jest & React Testing Library in a React Vite Project

1. Install Dependencies

yarn add --dev jest babel-jest @babel/preset-env @babel/core @babel/plugin-syntax-jsx @babel/preset-react @testing-library/dom @testing-library/jest-dom @testing-library/react @testing-library/user-event babel-preset-react-app identity-obj-proxy jest-circus jest-scss-transform jest-watch-typeahead

2. Set Jest & babel configs in package.json

"jest": {
    "roots": [

nandorojo

Expo + Next.js Query Params State 🦦

A typical use-case on web for maintaining React State is your URL's query parameters. It lets users refresh pages & share links without losing their spot in your app.

URL-as-state is especially useful on Next.js, since next/router will re-render your page with shallow navigation.

This gist lets you leverage the power of URL-as-state, while providing a fallback to React state for usage in React Native apps.

It's essentially a replacement for useState.

texastoland

export abstract class List<T> {
  readonly isEmpty: boolean
  constructor(readonly length: number) {
    this.isEmpty = !length
  }
  *[Symbol.iterator](): Generator<T, void, void> {
    for (let xs = this as List<T>; xs instanceof NonEmptyList; xs = xs.rest)
      yield xs.first
  }
}

dz4k

-- Usage: _="install Draggable(dragHandle: .titlebar in me)"

behavior Draggable(dragHandle)
  init
    if no dragHandle set the dragHandle to me
  end
  on pointerdown(clientX, clientY) from dragHandle
    halt the event
    trigger draggable:start -- hooks, e.g. for adding a drop shadow while dragging
    measure my x, y

mrousavy

In computing, memoization or memoisation
is an optimization technique used primarily
to speed up computer programs by storing
the results of expensive function calls and  
returning the cached result when the same
inputs occur again.                                         
                                                     — wikipedia