watermark logo

5 Views· 23 September 2022

How we built our website with React Hooks

Advertisement


KelvinNewb
Subscribers

I'll share about our stack of frameworks, libraries and tools to build a fully custom site https://designcode.io

In this video, I’ll explain how we used React Hooks, Gatsby, Styled Components, Contentful, Netlify and Firebase.

Topics
- React Hooks
- Starting Template with Gatsby
- Layout using Styled Components
- CMS on Contentful
- Auth and Firestore on Firebase
- Deploying on Netlify
- Performance and PageSpeed
- Syncing between iOS and Web
- How we organize our files
- Custom Hooks

Resources
⚛️ React Hooks: https://reactjs.org/docs/hooks-intro.html
👩‍💻 VSCode: https://code.visualstudio.com
🍱 Gatsby: https://www.gatsbyjs.com
🎨 Styled Components: https://styled-components.com
✍️ Contentful: https://www.contentful.com
🚀 Netlify: https://www.netlify.com
🚄 PageSpeed: https://developers.google.com/....speed/pagespeed/insi
🎨 Figma design tool: https://www.figma.com
🍔 Illustrations: https://shape.so
🤳 Phone Mockups: http://angle.sh

Learn UI Design
🖌 UI Design for developers: https://designcode.io/ui-design
🌈 Design system in Figma: https://designcode.io/figma
🎨 Figma Handbook: https://designcode.io/figma-handbook
📱 iOS Design Handbook: https://designcode.io/ios-design-handbook

Learn React
💻 Build a web app with React Hooks: https://designcode.io/react-hooks
💻 React Native for designers: https://designcode.io/react-native
💻 React for designers: https://designcode.io/react

DesignCode
💬 Discord: https://discord.com/invite/JGDtQcdk72
🐦 Twitter: https://twitter.com/designcodeio
📸 Instagram: https://www.instagram.com/mengto
📱 iOS App beta: https://testflight.apple.com/join/dr79Sv7u

Show more


Up next

Advertisement


0 Comments