How to make React Web app with Airtable.js as backend -1

Enes Efe
4 min readSep 27, 2021

--

In this post, I’ll show you how to create my web page with react.js and Airtable API

Source code of my web page

Status of my web page

My web page was static and I wanted to change my web app from statically to dynamically because, in the last year, I built a lot of projects for my customers and so I had a lot of projects to show my web page.

In the beginning, React and netlfy were enough.

Please review my database on Airtable. Feel free to copy base for your custom database

https://airtable.com/shrvvntR6o8rPt4M8/

How to add a new project to the Airtable database

1. Go to Airtable | Create apps that perfectly fit your team’s needs

2. Click on Sign up for free

3. Click on Sign in

If you have no account please keep going sign-up page.

4. Type Email address

5. Type password

6. Click on Sign in

7. Personal-web-page project is my database

8. Click on personal-web-page

9. Type “Demo project” in the title

10. Type in project description

11. Click on Drop files here

12. Select new cover image from file upload menu

13. Click on Upload

14. Click on Image for source code

15. Right-click on the image and copy

16. Click on Close attachment viewer

17. Click on highlight CUrl and paste it into input

20. Type Source link of your projecet

21. Type Project link

22. Click on background_color

That’s awesome for the category and filter component because when I want to change background just go there and change the background_image value

23. Type “#FBF7F4”

Or whatever you want to type with “#”

24. Click on platform_name

I am working on different platforms for my customers and also when I show my project on the website, this function helps me filter.

25. Click on Custom Development

That’s it 🚀🚀🚀 Project added on my website

In my next post, I will show you how I integrated Airtable with my react app. Please follow me for the next awesome project.

Contact me: https://iamenes.com

--

--

Enes Efe
Enes Efe

Written by Enes Efe

Bubble and Front-end developer, Sports scientist, Problem Solver iamenes.com

No responses yet