본문 바로가기
안녕하세요, 프론트엔드 개발자 김현우라고 합니다. 제 블로그에서는 개발과 관련된 다양한 이야기들을 풀고있어요. 아무리 어려운 문제라도, 쉽게 풀어 설명할 수 있는 방법은 무조건 존재한다고 생각을 해요. 제가 연재해드리는 내용이 선한 영향력을 가져다 주었으면 좋겠어요.

전체 아티클153

Axios Header에 Access Token을 넘기는 방법은? 서론 토이프로젝트에서 Axios 통신을 사용해 Header 부분에 Access Token을 넘겨야하는 상황이 발생했다. 오늘 포스팅에서는 Axios 통신에서 Access Token을 넘기는 방법에 대해 포스팅을 해보려고 한다. 프론트 단에서 백엔드로 어떻게 데이터를 넘길까? Access Token을 header Authorization에 넣어서 * Bearer과 Token을 합쳐 보내줘야 데이터를 가져올 수 있다. 프론트 단에서 header Authorization에 넣어 백엔드로 넘기면, 백엔드에서는 Access Token을 대조하여 걸맞는 정보를 다시 넘겨준다. * Bearer 이란? 정보의 신호 전달을 네트워크 단에서 손실 없이 있는 그대로 전달하는 서비스를 말한다. 베어러 서비스가 종합 정보 통신.. 2023. 1. 7.
요즘 많이 사용하는 JWT는 뭘까? 서론 요즘 웹 개발을 하면서 JWT 라는 기술이 되게 많이 사용된다. 로그인 기능을 구현하면서, 자연스레 프론트 개발을 접하며 백엔드와의 소통시 JWT에 대한 개념이 자주 나오곤하는데, 오늘 포스팅에서는 JWT에 대해서 다뤄볼 예정이다. JWT(JSON Web Token)가 뭘까? JWT는 JSON Web Token의 약자로, 인증에 필요한 정보들을 암호화시킨 Json 형태의 토큰이다. 웹에서 서버에서 클라이언트의 인증 방식으로 토큰 방식 외에 세션과 쿠키 인증 방식이 있지만, 세션과 쿠키 방식을 지원하지 않는 앱 같은 경우에는 이러한 토큰 방식은 필연적이라고 말할 수 있다. JWT를 통한 인증 방식은 JWT 토큰(Access Token)을 HTTP 헤더에 실어 서버가 클라이언트를 식별하는 방식이다. J.. 2023. 1. 5.
프론트엔드 실무 면접 준비해보기 https://xiubindev.tistory.com/119 (출처) 실제로 받은 프론트엔드 개발자 면접 질문 모음 첫 번째 직장에는 운 좋게 바로 들어가서 일을 시작했기 때문에, 제대로 취업 준비를 해본 경험이 없었다. 그래서 이번에 다시 프론트엔드 개발자로 취업 준비를 하면서 코딩 테스트 공부도 하 xiubindev.tistory.com CS ⭐️ 브라우저 주소창에 www.google.com을 입력하면 어떤 일이 일어나나요? DNS에 대해 설명해주세요. ⭐️ GET과 POST의 차이는 무엇인가요? REST API에 대해 설명해주세요. ⭐️ 객체 지향 프로그래밍이란 무엇인가요? 자료구조 stack과 queue에 대해 설명해주세요. ⭐️ 프로세스와 스레드에 대해 설명해주세요. JavaScript ⭐️ P.. 2023. 1. 2.
프론트엔드 기초 CS 대비 서론 그냥,, 면접 준비를 해보자,, CS 브라우저에 Google 주소창을 입력하면 어떤 일이 일어날까요? 'www.google.com'을 주소창에서 입력하면 일어나는 일 'www.google.com'을 주소창에서 입력하면 일어나는 일 _개발자로서 웹이 어떤 과정으로 동작하게 되는지, 무슨일이 어떻게 일어나는지에 대해 제대로 이해하지 못한 채 그냥 만들고 보여지는데에만 집중했던 것 같다. 어느 정도 큰 그림으로라도 이 velog.io DNS에 대해 설명을 해주세요 : URL들의 이름과 IP 주소를 저장하고 있는 데이터베이스로, 웹 사이트를 위한 주소록이라고 생각을 하면 된다, 숫자로 된 IP주소 대신 사용자가 사용하기 편리하도록 주소를 매핑해주는 역할을 한다. GET과 POST의 차이에 대해서 설명을 해.. 2023. 1. 2.
이벤트 버블링이란? 서론 웹 개발을 하는 사람이라면 버블링와 캡쳐링에 대해서 한번쯤은 들어보았을 것이다. 프로젝트를 진행하면서 애매모호했던 프론트엔드 지식들을 구체화시키고자 오늘의 포스팅은 `버블링과 캡쳐링` 이라는 주제로 포스팅을 해보려고 한다. 버블링이란 특정 화면 요소에서 이벤트가 발생했을 때, 해당 이벤트가 더 상위의 화면 요소들로 전달되어가는 특성을 의미한다. 첫 이벤트가 발생했을 때 브라우저는 이벤트를 하위 컴포넌트에서 상위 컴포넌트로 전파시키는 방식을 가지는데, 이를 이벤트 버블링이라고 한다. 버블링의 원리 한 요소에 이벤트가 발생하면, 이 요소에 할당된 핸들러가 동작하고 이어서 부모 요소의 핸들러가 동작을 한다. 가장 최상단의 조상 요소를 만날 때까지 이 과정이 반복되면서 요소 각각에 할당된 핸들러가 동작한다.. 2023. 1. 2.
기존 React 프로젝트에 TypeScript 적용하기 서론기존 리액트 프로젝트에서 토이프로젝트를 리팩토링하면서 타입스크립트를 적용해야하는 일이 생겼다.이번 게시물에서는 타입프로젝트에 관련된 내용과, 타입스크립트를 적용하는 방법을 알아보려고 한다.(타입스크립트 공부를 위해 포스팅을 한 게시물이니, 코드가 필요하신 사용자들은 적용하기 파트부터 봐주시기 바랍니다)타입스크립트란?마이크로소프트가 발표한 타입스크립트(TypeScript)는 자바스크립트를 기반으로 정적 타입 문법을 추가한 프로그래밍 언어이다.프로젝트에서 프론트엔드 분야에서 널리 흔하게 사용되고 있으며, 필연적으로 사용되는 기술이 되어버렸다. 컴파일 언어이면서 동시에 정적 타입의 언어이다.자바스크립트의 경우 인터프리터 언어로 런타임에서 오류를 발견할 수 있다. 반대로 타입스크립트는 정적 타입의 컴파일 언.. 2022. 12. 29.