전체 글(40)
-
JSON 파일을 작성 해볼까?!
JSON(JavaScript Object Notation)은 데이터를 저장하거나 교환하기 위해사용하는 가볍고 읽기 쉬운 형식이다.특히 웹 개발에서 API 데이터 송수신에 자주 쓰인다.어찌 보면 쉽고, 간단하지만 놓칠 수 있는 부분까지 작성해보려 한다! 1. JSON이란 뭘까? JSON은 사람이 읽기 쉽고, 컴퓨터도 해석하기 쉬운 텍스트 기반 데이터 형식이다.자바스크립트에서 객체를 작성하는 방식과 거의 똑같아서 배우기도 쉽고 작성도 간단하다.특히 XML보다 간결하고, 읽기 쉽다는 장점 때문에 최근 더욱 인기가 높아졌다. 2. JSON의 기본 문법 JSON 파일을 작성할 때는 몇 가지 규칙만 알면 된다. 데이터는 키(key)와 값(value)이 한 쌍으로 구성된다.키는 항상 따옴표(" "..
2025.03.13 -
SSR과 CSR의 차이, 무엇이 다를까?
웹 개발을 하다 보면 "SSR(Server-Side Rendering)"과 "CSR(Client-Side Rendering)"이라는 개념을 자주 접하게 된다. 두 방식 모두 웹페이지를 렌더링하는 방법이지만, 각각의 장단점이 명확하게 다르다.이번 글에서는 SSR과 CSR의 차이를 비교하면서, 언제 어떤 방식을 선택해야 하는지 알아보겠다.1. SSR(Server-Side Rendering)이란?SSR은 말 그대로 "서버에서 렌더링하는 방식"이다. 사용자가 웹사이트에 접속하면,서버에서 HTML을 완전히 구성한 후 이를 브라우저로 전송하는 방식이다. 즉, 사용자가 페이지를 요청할 때마다 서버가 HTML을 생성해 응답해 준다. ✔️ SSR의 동작 방식사용자가 브라우저에서 특정 URL을 요청한다.서버에서 해당 ..
2025.02.07 -
React] Redux와 상태에 대한 이해
웹개발을 하다 보면 상태관리가 필요할 때가 있다.즐겨찾기 갯수의 증가, 인스타그램 좋아요 버튼 등등.. 이때 Redux의 사용은 상태 관리를 보다 효율적으로 도와주는 도구다.이번 글에서는 Redux의 개념과 상태의 정의에 대해 자세히 알아보려고 한다. 상태(State)의 정의 상태는 애플리케이션의 특정 시점에서의 데이터나 정보를 나타낸다.사용자 인터페이스(UI)의 현재 상태를 반영하며, 사용자의 입력,서버로부터의 응답, 애플리케이션의 로직 등에 따라 변할 수 있다.예를 들어, 로그인 여부, 장바구니에 담긴 상품, 사용자의 설정등이 상태에 포함된다.상태는 보통 다음과 같은 특성을 가진다 변경 가능성: 사용자의 행동이나 애플리케이션의 이벤트에 따라 상태는 변할 수 있다. 중앙 집중식 관리: 상태..
2024.10.24 -
CSS] position: sticky로 메뉴바 고정시키기!
오늘도 개발을 하던 중 측면에 넣어둔 카카오톡 상담하기 및nav bar 상단으로 이동하는메뉴바를 특정 스크롤까지 내렸을 때,고정되어 따라 내려오는 기능을 하고 싶었다.(원래는 특정 스크롤까지 내려오면 출력되게 해 놨음) Goo글링을 하고 열심히 했지만, 정확한 설명이 안돼서 찾지 못하다가Sticky라는 기능을 찾았다!그것에 대해 정리해보려고 한다!(짧으니 쓰윽보면편하다!) 1. position: sticky란?position: sticky는 특정 요소가 스크롤 중에 지정된 위치에 도달하면 그 자리에서 고정되는 CSS 속성이다.일반적인 상대적 위치와 고정된 위치의 혼합형으로, 스크롤하다가 고정될 자리를 정할 수 있는 것이 특징이다. (나는 Styled-in-component를..
2024.10.18 -
웹에서 제공하는 파일 다운로드 방식] 정적 파일 vs 동적 파일
웹개발 중 우리가 제공하는 파일을 다운로드할 수 있게 하는 기능을 구현하던 중.....선택에 기로에 놓이고 만다 니는 정적파일로 제공할래? 동적파일로 제공할래? 그게 뭔데? 대충 감은 오지만 정확한 상이 머리에 맺히지는 않더라그래서 정리의 시간을 가져봤다! 1. 정적 파일 제공 (Static File Serving) 정적 파일 제공은 미리 서버에 저장된 파일을 사용자의 요청에 맞춰 그대로 전달하는 방식이다.파일의 내용은 요청 시점에 변하지 않으며, 주로 HTML, CSS, 이미지, JavaScript 같은 파일들이 이에 속한다. 특징:미리 준비된 파일: 서버에 미리 저장된 파일로, 요청 시 변경되지 않고 동일한 파일이 제공된다.빠른 응답: 서버는 파일을 따로 처리할 필요가 없어서 요청에..
2024.10.15 -
주니어 개발자의 우당탕탕 개발새발 스토리 (로직 설계)
오늘은 어떠한 문법이나 라이브러리가 아닌 안 풀리던 문제가갑자기 팟!!! 하고 풀리는 개발스토리(부제: 로직설계) 간단하게 풀어보려고한다! 1. 기(起) 나는 현재 진행 중인 프로젝트에서대부분의 개발자들이 그렇겠지만 막 다른 길에 갇혀버린 생각이들 때가 있다.근데 나는 개인프로젝트라 자문을 구할 사람도 없어서, 할 수 있는 건 레퍼런스와 채찍피티선생님에게 찾아갈 뿐이다.그런데도 해결이 안 될 때가 있다. 특정 문법이나, 구문이 문제가 아니면각자 개발하고 구현하는 게 다 다르고오류가 발생하는 것이 아닌 로직을 설계하는 단계부터 막혀버리면참고할 레퍼런스도 없다. 근데 여태까지 그렇게 막힐 때마다 경험하는 것은1~2일, 길게는 일주일 동안 매달려서 머리를 꽁꽁 싸매도 해결이 안 되던 것이잠깐 딴짓하거나..
2024.10.11