Devaslife – Gmail-like UI with React Native


React Native

Updated Sep 22nd, 2022

My new favorite coding channel on Youtube has done it again. Video here.

Title: How to build Gmail-like UI with React Native [at a Zen temple Koshoji]

Stack: Restyle for UI components (Interesting that this is from the Shopify team). Jotai for state management since it is simple and clean. No expo (going to use a lot of custom native implementation).

Key Takeaways

useAtom from jotai

A lot of “useMemo” and “useCallback” hooks

snapPoints = useMemo(()=> ['40%', '90%'], [])

Leveraged forwardRef

const ThemePicker = forwardRef<ThemePickerHandle, Props>((_props, ref) => {...}

useImperativeHandler

 useImperativeHandle(ref, () => ({
    show: () => {
      const { current: bottomSheet } = refBottomSheet
      if (bottomSheet) {
        bottomSheet.snapToIndex(0)
      }
    }
  }))