분류 전체보기(42)
-
웹에서 실시간 데이터를 처리하는 방법
실시간 데이터란 ?실시간 데이터란 무엇일까요? 다들아시겠지만 다시한번 정의를 봐봅시다. 실시간 이라는 단어의 뜻은 실제 흐르는 시간과 같은 시간. 이라고 합니다. 그렇다면 실시간 데이터는 왜 필요할까요 ? 어떤 부분에서 사용될까요 ? 실시간 데이터가 쓰이는 곳사실 컴퓨터와 가까운 우리라면 공감할만한 예시를 들고왔습니다. 예를들어 총을 쏘는 게임을 하고 있다고 생각해봅시다. 그러면 나는 상대방의 위치를 정확하게 알고 있고 상대방에게 총을 쏘면 상대방은 총을 맞아야 합니다. 이게 우리가 원하는 실시간 데이터 입니다. 만약 데이터가 실시간으로 처리되지 않는다면 상대방은 죽지 않고 나만 죽는 불상사가 발생하게 됩니다. 또 예를 들어 보겠습니다. 이번엔 한국 주식을 예로 들겠습니다. 한국 주식을 보고 있..
2025.03.04 -
GraphQL이란 뭘까요?
메타에서 사용하는 언어 ..? REST와 비교되는 언어 ?.. 언제가 부터 떴는데 뭔지는 모르고 있던거 ..그리고 ... 메타와 당근에서 잘 활용한다는 그거 !!!! 뭔지 알아보겠습니다.공식 사이트 훑어보기무엇인지 감을 잡으려면 먼저 공식 문서를 보는 편입니다.공식 사이트 소개글 : https://graphql-kr.github.io/GraphQL은 API를 위한 쿼리 언어이며 이미 존재하는 데이터로 쿼리를 수행하기 위한 런타임 입니다. GraphQL은 API에 있는 데이터에 대한 완벽하고 이해하기 쉬운 설명을 제공하고 클라이언트에게 필요한 것을정확하게 요청할 수 있는 기능을 제공하며 시간이 지남에 따라 API를 쉽게 진화시키고 강력한 개발자 도구를 지원합니다.음 .... 일단 쿼리(질의) 언어 인거 같..
2025.03.01 -
리액트서버 API와 hydration이 뭔데?
WHY? 요새 대체 SSR과 Hydration이 뭔지는 알고는 있지만 정확하게 어떻게 돌아가는지 몰라서 이 글을 작성하게 됐습니다.React Server API리액트에서는 서버 환경(node) 에서 사용할 수 있는 API가 존재합니다. 이를 통해 서버환경에서 리액트를 렌더링할 수 있습니다.왜 이게 나왔을까요 ??- 클라이언트에서 모든 렌더링을 해결하는(CSR)은 여러 단점이 존재했습니다.- SEO, 보안문제, 더 늦은 초기 로딩 속도 등등 ..- 따라서 서버에서 리액트를 서버렌더링을 해줘야하는 상황이 필요해져서 그렇습니다. 그렇다면 어떤 API들이 있을까요 ?renderToStringReact Tree를 string으로 변환해줍니다.import { renderToString } from 'react-do..
2025.02.20 -
웹 표준에서 자주 쓰이는 객체들
웹 표준이란?웹 사이트나 웹 페이지가 웹 표준을 준수한다는 것은 일반적으로 올바른 HTML, CSS, 자바스크립트를 사이트나 페이지가 가지고 있다는 것을 뜻한다. HTML은 [접근성](https://ko.wikipedia.org/wiki/%EC%A0%91%EA%B7%BC%EC%84%B1)과 [시맨틱 HTML](https://ko.wikipedia.org/wiki/HTML "HTML")의 가이드라인을 충족해야 한다.wiki 백과 출처웹 표준을 사용하면 다양한 브라우저와 기기에서 동일한 결과를 보장합니다.웹 표준을 준수하면 접근성이 향상 됩니다.웹 표준을 사용해서 세계 각국의 개발자들이 유지보수가 용이 해집니다.웹 표준을 준수하지 않으면..웹 표준을 준수하지 않으면 브라우저 호환성 문제가 생깁니다. 특정 브..
2025.02.14 -
JS 브라우저 환경에서의 이벤트루프
자바스크립트의 런타임런타임(runtime)은 컴퓨터 프로그램이 실행되는 환경이다. JS를 사용해서 개발하는 개발자라면 필수로 JS가 실행되는 동안 코드가 어떻게 돌아가는지 알고 있으면 좋을것 같다. JS는 싱글스레드 언어다. 싱글 스레드란 한번에 한가지 작업만 처리할 수 있다는 것이다. 예를 들어 당신이 식당에 갔는데 손님을 하나만 받을수 있는 식당에 가서 20명 이상 대기가 있는 상태이다.근데 부엌을 슬쩍 보니 한사람이 식사가 끝나면 그릇이 없어서 식사가 끝나고 설거지를 하고 테이블 하나를 닦고 청소한 후 다음 손님이 들어가는 것이다. 이 답답한 식당에서 당신은 20명 이상 웨이팅할 자신이 있는가? 당연하게도 그럴 자신이 없는 JS를 만든 사람은 해결책을 만들어 뒀다. 그 해결책에 대해서 알아보자 대표..
2025.02.06 -
인공지능과 프론트엔드 개발 그리고 과제
라고 적고 과제 회고라고 합시다.과제를 2번 겪었다. 결과는 둘 다 탈락이였다. 처음에는 그냥 순수 나의 실력으로 과제를 해결해보려고 했다. 하지만 기간내에 요구사항을 다 작성하지도 못했다.2번째는 vercel에서 제공해주는 LLM 서비스인 V0를 사용했다.https://v0.dev/기능구현을 끝맞추긴했다. 하지만 처음 써보는 css툴인 테일윈드를 썼던 탓이였을까 과제로 내주어진 스타일을 정확히 맞추지 못하였고, 결국 탈락으로 이어진듯하다. 또 다른 요구사항인 testcode를 작성해보려고 했지만 인공지능의 힘을 빌려도 택도 없었다.지금 내가 생각하는 인공지능에 대한 이미지는 이렇다. 1. 뭣도 아닌데 세간에서는 호들갑을 떨면서 개발자들의 일자리가 줄어든다고 한다.2. 하지만 내가 실제로 개발을 할 때는..
2024.12.30