ํ”ผ๋“œ๋กœ ๋Œ์•„๊ฐ€๊ธฐ
I built a community platform to discover all Web-based OS projects ๐Ÿ–ฅ๏ธ
Dev.toDev.to
Frontend

Vanilla JS์™€ Supabase ๊ธฐ๋ฐ˜์˜ ๊ฒฝ๋Ÿ‰ Web OS ์ปค๋ฎค๋‹ˆํ‹ฐ ํ”Œ๋žซํผ ๊ตฌ์ถ•

I built a community platform to discover all Web-based OS projects ๐Ÿ–ฅ๏ธ

Hyggshi OS2026๋…„ 6์›” 27์ผ1๋ถ„beginner

AI ์š”์•ฝ

Context

๋ถ„์‚ฐ๋œ Web-based OS ํ”„๋กœ์ ํŠธ ์ •๋ณด์˜ ํŒŒํŽธํ™”๋กœ ์ธํ•œ ์ ‘๊ทผ์„ฑ ์ €ํ•˜ ๋ฐœ์ƒ. ํšจ์œจ์ ์ธ ํ”„๋กœ์ ํŠธ ํƒ์ƒ‰๊ณผ ํ‰๊ฐ€๋ฅผ ์œ„ํ•œ ์ค‘์•™ ์ง‘์ค‘ํ˜• ํ—ˆ๋ธŒ์˜ ํ•„์š”์„ฑ ๋Œ€๋‘.

Technical Solution

  • ํ”„๋ ˆ์ž„์›Œํฌ ์˜ค๋ฒ„ํ—ค๋“œ ์ œ๊ฑฐ๋ฅผ ์œ„ํ•œ Vanilla JS/HTML/CSS ๊ธฐ๋ฐ˜์˜ Lightweight Frontend ์„ค๊ณ„
  • PostgreSQL ๊ธฐ๋ฐ˜ Supabase ๋„์ž…์„ ํ†ตํ•œ ์‹ค์‹œ๊ฐ„ ๋ฐ์ดํ„ฐ ๊ด€๋ฆฌ ๋ฐ RLS(Row Level Security) ์ •์ฑ… ๊ธฐ๋ฐ˜์˜ ๋ฐ์ดํ„ฐ ๋ณด์•ˆ ํ™•๋ณด
  • GitHub PR ๊ธฐ๋ฐ˜์˜ ํ”„๋กœ์ ํŠธ ์ œ์ถœ ํŒŒ์ดํ”„๋ผ์ธ ๊ตฌ์ถ•์„ ํ†ตํ•œ ๋ฐ์ดํ„ฐ ๋ฌด๊ฒฐ์„ฑ ๊ฒ€์ฆ ๋ฐ ๊ด€๋ฆฌ ํšจ์œจํ™”
  • Cloudflare Workers์™€ GitHub Pages ์กฐํ•ฉ์„ ํ†ตํ•œ ์„œ๋ฒ„๋ฆฌ์Šค ์ธํ”„๋ผ ๊ตฌ์ถ• ๋ฐ ์ •์  ์ฝ˜ํ…์ธ  ์ „์†ก ์ตœ์ ํ™”
  • RPC ๊ธฐ๋ฐ˜์˜ ์ปค์Šคํ…€ ์ธ์ฆ ๋กœ์ง ๊ตฌํ˜„์„ ํ†ตํ•œ ์‚ฌ์šฉ์ž๋ณ„ 1ํ”„๋กœ์ ํŠธ 1ํˆฌํ‘œ ์ œํ•œ ์‹œ์Šคํ…œ ์„ค๊ณ„

Key Takeaway

ํŠน์ • ๋„๋ฉ”์ธ์˜ ํ๋ ˆ์ด์…˜ ์„œ๋น„์Šค ๊ตฌ์ถ• ์‹œ ๋ณต์žกํ•œ ํ”„๋ ˆ์ž„์›Œํฌ๋ณด๋‹ค ๋‹จ์ˆœํ•œ ์Šคํƒ๊ณผ ์„œ๋ฒ„๋ฆฌ์Šค ์ธํ”„๋ผ๋ฅผ ์กฐํ•ฉํ•˜์—ฌ ์œ ์ง€๋ณด์ˆ˜ ๋น„์šฉ์„ ์ตœ์†Œํ™”ํ•˜๋Š” ์ „๋žต

์‹ค์ฒœ ํฌ์ธํŠธ

1. ๋‹จ์ˆœ ์ •๋ณด ์ œ๊ณต ํ”Œ๋žซํผ ๊ตฌ์ถ• ์‹œ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ ์˜์กด์„ฑ์„ ์ตœ์†Œํ™”ํ•˜์—ฌ ์ดˆ๊ธฐ ๋กœ๋”ฉ ์†๋„ ํ™•๋ณด

2. Supabase RLS๋ฅผ ํ™œ์šฉํ•ด ๋ฐฑ์—”๋“œ API ์ฝ”๋“œ ์—†์ด DB ๋ ˆ๋ฒจ์—์„œ ๊ถŒํ•œ ์ œ์–ด ๊ตฌํ˜„ ๊ฒ€ํ† 

3. ์‚ฌ์šฉ์ž ์ฐธ์—ฌ ์ฝ˜ํ…์ธ ์˜ ํ’ˆ์งˆ ๊ด€๋ฆฌ๋ฅผ ์œ„ํ•ด GitHub PR ๋ฐฉ์‹์˜ ๊ฒ€์ˆ˜ ํ”„๋กœ์„ธ์Šค ๋„์ž… ๊ณ ๋ ค

ํƒœ๊ทธ

#Cloudflare Workers#Supabase#RLS#Vanilla JS#Serverless
์›๋ฌธ ์ฝ๊ธฐ