JavaScript Workshop - How to add Web Database to a React App

Let's create a front-end React Component that exchanges the contents of a 3rd party Web Database service using Express as a proxy.

ABOUT THIS EVENT

In this 2 hour workshop, you'll walk away with a React project that retrieves data from and uploads data to Kintone, a web database service.

We'll walk you through the basics of REST API calls and CORS, usage of State and Effect Hooks, setting up an Express back-end, and using it as a proxy.

📎 PREREQUISITES

> 🤖 CLONE THE WORKSHOP REPOSITORY
This is the codebase that we will start the workshop from!

• https://bit.ly/react-x-rest

> 📂 GET A KINTONE SUBDOMAIN (DATABASE)
Apply for a free developer license and subdomain. You can also read up on all things Kintone API & customization!

• [Kintone.dev/new](http://kintone.dev/new/)

> 💾 INSTALL NODE & NPM

Verify that you have the latest Node.js & npm installed on your computer.

If you don't have Node.js & npm installed, refer to the [Guide on Installing Node.js & npm {macOS & Windows}](https://dev.to/kintonedevprogram/guide-on-installing-nodejs-npm-macos-windows-16ii) post for instructions.

🕒 EVENT SCHEDULE (IN PACIFIC TIME)

• 6:00 PM - Hello
• 6:10 PM - Workshop Overview
• 6:20 PM - Web Database Setup
• 6:50 PM - React Project Setup
• 7:00 PM - Build the React App
• 7:40 PM - Connect the App to the Web Database
• 7:50 PM - Wrap Up and Q&A
• 8:00 PM - Thank you & Survey Raffle

.

📺 CAN'T MAKE IT?

Subscribe to our YouTube channel to get notified when we post this workshop's recording!

This workshop will be live-streamed on YouTube Live.

• youtu.be/O6FnSGgGBRk

⚙️ WHAT IS KINTONE?

Kintone is a no-code/low-code cloud platform for teams to quickly & easily share and collaborate on their data.
You can add JavaScript, CSS, &/or HTML to enhance the front-end UI/UX of a Kintone App. This can include features such as maps, buttons, and color-coding.

Read how to customize and develop on the Kintone platform at kintone.dev!