gaearon

function mapValues(obj, fn) {
  return Object.keys(obj).reduce((result, key) => {
    result[key] = fn(obj[key], key);
    return result;
  }, {});
}

function pick(obj, fn) {
  return Object.keys(obj).reduce((result, key) => {
    if (fn(obj[key])) {

markerikson

[12:03 AM] acemarke: "controlled" and "uncontrolled" inputs
[12:04 AM] acemarke: if I have a plain, normal HTML page, and I put <input id="myTextbox" type="text" /> in my page(edited)
[12:04 AM] acemarke: and I start typing into that textbox
[12:04 AM] acemarke: it remembers what I've typed. The browser stores the current value for that input
[12:05 AM] acemarke: and then sometime later, I can get the actual element, say, const input = document.getElementById("myTextbox"), and I can ask it for its value: const currentText = input.value;
[12:05 AM] acemarke: good so far?
[12:08 AM] acemarke: I'll keep going, and let me know if you have questions
[12:08 AM] lozio: ok, actually I'm reading
[12:09 AM] lozio: good
[12:09 AM] acemarke: so, a normal HTML input field effectively stores its own value at all times, and you can get the element and ask for its value

fdidron

//Usage
import React from 'react';
import { BrowserRouter as Router } from 'react-router-dom';
import Route from './AuthRoute';

import Login from './Login';
import Private from './Private';

export default () => 
  <Router>

bradwestfall

S3 Static Sites

⚠ This post is fairly old. I don't keep it up to date. Be sure to see comments where some people have posted updates

What this will cover

• Host a static website at S3
• Redirect www.website.com to website.com
• Website can be an SPA (requiring all requests to return index.html)
• Free AWS SSL certs
• Deployment with CDN invalidation

EvanBacon

Many ways to useHooks

When I try to learn something, I search around for the optimal approach. In the case of hooks I found two reasonable approaches and one approach that only makes sense in some use-cases. Below I've documented all of them.

Use Case (useCase 😘)

I want to change the style of a text element when the user is clicking down on it. Because this is React Native for web, there are no CSS pseudo classes, so I need to manage all of the state myself. Because classes like active, focus, hover, and visited could be commonly used the API must be very self-contained. ... and I want people to like me, so I'm using hooks (the old implementation used render props).

Spread props

brentvatne

Hi there!

There's no automated way to do this, but it shouldn't be too hard to pull off! I'd say to just give it a shot using the following process:

1. What custom native code are you using in your app? Can it be replaced by something from the Expo SDK? If not, you may not be able to use the managed workflow for now and your journey ends here.
2. The same applies for libraries - here is an exhaustive list of libraries in the Expo SDK in an easy to read JSON format. Compare that with your package.json.
3. Create a new project with expo init - choose blank or blank (TypeScript).
4. Start copying your source over and getting it to a working state piece-by-piece.
5. Configure things like the bundle identifier, icon, splash screen, and android package in app.json.
6. Publish it in expo publish, do a simulator build with expo build:ios -t simulator and a build you can run in the Andro

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.

steve981cr

How to Release an Electron App on the Mac App Store

By Steve Carey - Last updated May 15, 2024. Originally published Feb 4, 2020.

Super basic app example: Github electron-app-store-example
To Do List app example (contains native node modules): github.com/steve981cr/electron-todo-example

Table of Contents

Introduction
Step 1) Start with your completed Electron Application
Step 2) Apple Developer Account