huw

How to integrate Remix, Sentry, and Cloudflare Workers (incl. tracing)

The code above is just a sample—I have adapted it from a production codebase and I can't guarantee it will work as-is. It's just here to illustrate what a solution should look like.

The main things you need to do to get everything hooked up are:

1. Rewrite instrumentBuild to accept a passed-through Hub instance, rather than using getCurrentHub() (including, perniciously, in helper functions such as hasTracingEnabled())
2. In server/index.ts, create a root transaction from the current route’s name and wrap the loaders and actions in spans via instrumentBuild.
3. In root.tsx, pass through your tracing & baggage into the meta function.
4. In root.tsx, include the current domain in tracePropagationTargets (because Remix fetchers will fetch from the entire URL rather than / root, which will confuse Sentry)
5. (Remix v2) In root.tsx, create an ErrorBoundary component (with the v2_errorBoundary flag set if you're

m4ll0k

777 Brockton Avenue, Abington MA 2351
30 Memorial Drive, Avon MA 2322
250 Hartford Avenue, Bellingham MA 2019
700 Oak Street, Brockton MA 2301
66-4 Parkhurst Rd, Chelmsford MA 1824
591 Memorial Dr, Chicopee MA 1020
55 Brooksby Village Way, Danvers MA 1923
137 Teaticket Hwy, East Falmouth MA 2536
42 Fairhaven Commons Way, Fairhaven MA 2719
374 William S Canning Blvd, Fall River MA 2721

vdbelt

addEventListener('fetch', event => {

    event.respondWith(purgeCache(event.request))

})

async function purgeCache(request) {

    const url = new URL(request.url)

gsabran

import { Accounts } from 'meteor/accounts-base';
import { ServiceConfiguration } from 'meteor/service-configuration';

// currently you need to use a local version of the facebook package with this change:
// https://github.com/meteor/meteor/pull/7550
import { Facebook } from 'meteor/facebook';

import { HTTP } from 'meteor/http';
import { OAuth } from 'meteor/oauth';

ryanflorence

We're excited to have you attend one of our workshops! Here's a JavaScript (re)fresher to help you get up-to-speed on some features of the language we'll be using.

Let and Const

JavaScript has always had var:

var name = 'Ryan'

dbismut

export function actionTypeBuilder(prefix) {
  return {
    type: actionType => `${prefix}/${actionType}`,
    loading: actionType => `${actionType}/loading`,
    ready: actionType => `${actionType}/ready`,
    stopped: actionType => `${actionType}/stopped`,
    changed: actionType => `${actionType}/changed`,
    error: actionType => `${actionType}/error`,
    success: actionType => `${actionType}/success`
  };

skosch

// meteor algorithm to check if this is a meteor serving http request or not
function IsAppUrl(req) {
  var url = req.url;
  if(url === '/favicon.ico' || url === '/robots.txt') {
    return false;
  }

  // NOTE: app.manifest is not a web standard like favicon.ico and
  // robots.txt. It is a file name we have chosen to use for HTML5
  // appcache URLs. It is included here to prevent using an appcache

ryanflorence

Folder Structure

Please note

While this gist has been shared and followed for years, I regret not giving more background. It was originally a gist for the engineering org I was in, not a "general suggestion" for any React app.

Typically I avoid folders altogether. Heck, I even avoid new files. If I can build an app with one 2000 line file I will. New files and folders are a pain.

rcdilorenzo

defmodule JSONMapBuilder do
  def to_map(list) when is_list(list) and length(list) > 0 do
    case list |> List.first do
      {_, _} ->
        Enum.reduce(list, %{}, fn(tuple, acc) ->
          {key, value} = tuple
          Map.put(acc, binary_to_atom(key), to_map(value))
        end)
      _ ->
        list

kevin-smets

Default

Powerlevel10k