바이브코딩

웹 애플리케이션이란

• 우리가 브라우저(chrome,Safari 등)에서 사용하는 '웹사이트'중 단순히 보기만 하는게 아니라 상호작용이 가능한 서비스를 웹 애플리케이션이라고 한다 ex) 블로그,유튜브,이메일,노션 등

• 단순한 정보전달을 넘어서 로그인,게시물,작성,댓글,결제 등 다양한 기능을 제공함

• 앱 설치 없이 주소만 입력하면 사용 가능, 접근성이 뛰어나고 유지,관리도 쉬움

웹 애플리케이션의 구조

• 하나의 웹앱은 "보이는 부분","일하는 부분","기억하는 부분"으로 나눔

1.프론트엔드-보이는 부분
-사용자가 눈으로 보고, 마우스와 키보드로 조작하는 부분
-HTML,CSS,JavaScript로 만들어짐
-UI,UX등이 이루어지는 곳

2.백엔드- 일하는 부분

• 서버에서 일어나는 모든 작업
• 로그인 정보 확인,데이터 처리, 권한 체크 등 실제 로직과 처리의 중심
• ex) Supabase와 Next.js

3.데이터 베이스 - 기억하는 부분

• 정보를 저장하고 불러오는 저장소 역할
• 유저 프로필 정보, 글 내용, 좋아요 수 등 웹 앱이 기억해야 하는 모든 것을 보관
• DB,테이블,SQL
• Supabase에서 다룸

4.API (통신)

• 프론트 엔드와 백엔드를 이어주는 다리 역할
• 프론트 엔드에서 백엔드로 요청(Request)하고 결과를 응답(Response) 받는 형식