본문 바로가기

728x90
반응형
분류 전체보기
728x90
반응형
273

Javascript는 비동기 함수를 어떻게 처리해 - 프로미스 시리즈 목차 이 글은 시리즈 글입니다. 이번 글에서는 자바스크립트에서 비동기 작업을 더 쉽게 다룰 수 있는 방식인 Promise에 대해 알아볼 것입니다. 기본적으로 자바스크립트가 비동기로 동작하지 않는다는 사실과 비동기룰 다루던 첫 형태인 콜백함수는 저번 글에서 다루었습니다! 자바스크립트가 비동기함수를 어떻게 처리하는지 동작 원리를 모르시는 분과 콜백함수가 뭔지 잘 모르겠다 하시는 분들은 이전 글을 참고해보세요! Javascript는 비동기를 어떻게 처리해 - 동작 원리 Javascript는 비동기를 어떻게 처리해 - 콜백 함수 Javascript는 비동기를 어떻게 처리해 - 프로미스 Javascript는 비동기를 어떻게 처리해 - async await Promise 프로미스가 뭘까요? 프로미스는 약속을.. 2021. 1. 20.
Javascript는 비동기를 어떻게 처리해 - 콜백함수 시리즈 목차 이 글은 시리즈 글입니다. 이번 글에서는 자바스크립트에서 처음으로 비동기 작업을 다뤘던 방식인 콜백함수에 대해 알아볼 것입니다. 기본적으로 자바스크립트가 비동기로 동작하지 않는다는 사실은 저번 글에서 다루었죠! 자바스크립트가 비동기함수를 어떻게 처리하는지 동작 원리를 모르시는 분들은 이전 글을 참고해보세요! Javascript는 비동기를 어떻게 처리해 - 동작 원리 Javascript는 비동기를 어떻게 처리해 - 콜백 함수 Javascript는 비동기를 어떻게 처리해 - 프로미스 Javascript는 비동기를 어떻게 처리해 - async await 콜백함수 예제 자바스크립트를 비동기 처리하기 위해 제일 처음으로 등장했던 방식은 콜백함수를 이용해 처리하는 것이었습니다. 요즘은 이 방식을 잘 사.. 2021. 1. 20.
Javascript는 비동기를 어떻게 처리해 - 동작 원리 시리즈 목차 자바스크립트는 비동기 작업을 할 수 있다! 정도로 보통 알고 있죠. 이러면 안됩니다. 저 또한 이 과정을 모른 채 그냥 코딩만 해왔었는데 이젠 하나하나 공부해보려 합니다. 프로미스가 뭔지, async await가 뭔지 궁금해하고, 위의 내부과정을 알고싶어해야 했죠. 이를 알고 싶다면 먼저 자바스크립트에 대해 알아야 합니다. 이번 글에서는 자바스크립트가 비동기를 어떻게 처리하는지 그 원리에 대해 알아보고, 이후 글에서 프로미스, async await, fetch에 대해 비교하고 글을 수정해볼게요. Javascript는 비동기를 어떻게 처리해 - 동작 원리 Javascript는 비동기를 어떻게 처리해 - 콜백 함수 Javascript는 비동기를 어떻게 처리해 - 프로미스 Javascript는 비.. 2021. 1. 19.
CORS 이슈 해결하기 cors는 cross origin resource sharing의 약자로 개발할 때 많이 발생하는 이슈 중 하나입니다. 특히 최근에는 서버와 프론트의 ip 주소가 달라 이런 경우가 더 많이 발생하고 있는데, 이 이슈는 브라우저에서 요청 못하게 막는 거여서 제대로 해결하려면 어려운 부분이죠. cors가 뭔지 먼저 알아봅시다. CORS의 의미 cors에서 말하는 origin은 url에서 프로토콜(https) + 호스트(www.naver.com) + path(/users) + 쿼리(?sort=asc&page=1) + fragment(#foo)로 이루어진 부분을 말한다. 여기에 포트번호가 있다면 포트번호까지 합친 것이 origin 이고 포트번호가 없다면 기본포트인 80을 사용한다는 의미입니다. 여기서 포트번호까.. 2021. 1. 18.
웹사이트가 브라우저에 뜨는 과정 웹사이트가 브라우저에 뜨는 과정을 알아보자. 단골 개발자 면접 질문중에 하나로 네트워크가 있지. 네트워크 수업을 들었다면 조금 더 이해가 쉬울텐데 이 과정을 간단히 정리해보면 다음과 같다. 요약 사용자가 브라우저에 url 입력 url 에서 도메인 name 부분을 DNS 서버에서 검색한다. DNS 서버에서 해당 domain name에 해당하는 ip 주소를 찾아 url 정보와 함께 전달. 웹페이지 url 정보와 전달받은 ip 주소는 http 프로토콜을 사용해 http 요청 메세지를 생성. 4번에서 생성된 http 요청 메세지를 tcp 프로토콜을 사용해 인터넷을 거쳐 ip 주소의 컴퓨터로 전송. 도착한 http 요청 메시지는 http 프로토콜을 사용해 http 응답을 만든다. 만들어진 http 메시지를 다시 .. 2021. 1. 18.
GET, POST 메소드 차이점 개발을 하다보면 API를 많이 접할 수 밖에 없다. FE든, BE든.. 그냥 Restful API 대충 안다고 생각하고 개발만 했었는데 백엔드 인턴 면접 때 실제로 이렇게 물어보니까 답을 할 수가 없었다😂. 이런 공부는 어떻게 해야할까. 일단 이 질문에 답해보자. GET은 가져오는 것이고 POST는 수행하는 것이다. 즉 get은 select문과 비슷하고, post 는 데이터베이스에 뭔가 값을 저장하던가 확인할 때 사용한다. 자세한 차이는 아래 표에 비교해두었다. GET POST 히스토리 parameter가 URL 일부 => 브라우저 기록에 남음 parameter 브라우저에 저장 x 북마크 URL로 인코딩되므로 북마크 가능 요청 parameter가 req body 에 포함. 북마크 x parmeter 전송.. 2021. 1. 11.
세션이랑 쿠키가 뭘까 오늘부터는 공부한거 빠르게 정리하는 식으로 블로그 글 써보려고 한다. 그래서 반말체로 이렇게 쓸거야. 요즘 코테랑 면접 같은거 조금씩 봐보면서 기본 공부랑 알고리즘 PS(Problem Solving)라고도 하는 거 같은데 이 두 가지를 준비해야겠다는 생각이 많이 든다. 마크다운도 공부할 겸 글도 마크다운으로 써보자. 첫 번째로 정리해볼 것은 세션이 무엇인지. 이와 비슷하다 할 수있는 쿠키는 또 뭔지 정리해보려고 한다. 먼저 세션부터 살펴보자. 세션 Session 세션은 방문자가 웹서버에 접속한 상태를 한 단위로 보고 이 상태를 세션이라고 한다. 일정 시간동안 같은 사용자(브라우저)로부터 들어오는 일련의 요구를 하나로 유지시키는 기술을 세션이라고 하는 것. 여기서 일정 시간은 사용자가 웹에 접속한 시점부터.. 2021. 1. 10.
티스토리 다크모드 적용 상세 - Book Club 테마 기준 안녕하세요 오랜만에 글 올리게 되었네요!! 학기 중엔 방학동안 글 많이 올려야지 벼르고 있었는데, 이번 방학동안 인턴하면서 바빠서 글을 단 하나도 올리지 않았습니다...ㅎㅎㅎ 방학이 이제 2일하고 7시간 정도 남았군요. 정말 시간 빠른 것 같습니다. 다크모드 기초 설정 오늘 올릴 글은 티스토리에 다크모드 끼얹기 2편입니다. 요즘 다크모드가 눈 건강에도 좋고 웹 디자인에 필수 요소로 자리잡고 있죠. 티스토리에도 다크모드를 적용할 수 있는 방법이 있습니다. CSS를 좀 건드리긴 해야하지만요! 그럼 어떻게 적용하는지 자세히 알아보도록 하겠습니다. 2020/02/24 - [개발/Blog] - 티스토리 다크모드 적용하기 티스토리 다크모드 적용하기 요즘 아이폰이나 맥북, 윈도우에서 다크테마 이른바 다크모드 서비스가.. 2020. 8. 29.
우여곡절 많던 아이패드와 매직 마우스 2 드디어 연결 안녕하세요 구운밤입니다. 오랜만에 글을 올리게 되었네요! 사실 글을 쓸거리는 많이 있는데 요즘 코로나로 학교 과제도 많이 나오고 시험 공부도 하나도 못하고 있어서 글을 쓸 틈이 없었답니다.. 하하 얼마 전까지 아이패드 프로 11인치 (3세대) 버전을 사용하다가 4세대 12.9인치로 갈아타게 되었는데요! 갈아타면서 또 저번 기기에서도 연결하지 못했던 매직 마우스 2를 다시 연결해보기 위해 이리저리 글을 찾아보았습니다. 설정에 손 쉬운 사용에 들어가서 찾아봐라, Assistive touch 를 활성화하고 블루투스 기기에서 찾아봐라 등 많은 글 들이 있었는데 언제부터인가 애플이 매직 마우스 2 연결 지원을 종료했다는 글도 보이고 그래서 포기한 상태였습니다. 그런데 위 사진!!! 갑자기 블루투스의 ‘구운밤의 마.. 2020. 6. 12.
Spring Boot 프로젝트 생성 백엔드 대기업 모집 문서를 보면 거의 대부분 적혀있는 프레임워크 중 대표적인 것이 있죠. 바로 자바 스프링입니다. 저는 Node.js 위주로 공부를 해왔었는데, 스프링이 도대체 뭐길래 이렇게 많이 찾는지, 어떤 차이점이 있고 어떤 장점이 스프링을 사용하게 하는 건지 공부해보려고 합니다. 이제부터 스프링을 공부해 보고자하는 초보 백엔드 개발자로써 제가 따라한 기본 프로젝트를 차근차근 설명해보겠습니다. Dependency Injection, Inversion of Control Spring에서 가장 핵심적인 개념으로 DI / IoC 가 있습니다. 스프링은 사용자가 컴포넌트를 관리하지 않고, 프레임워크가 컴포넌트를 관리합니다. 여기서 컴포넌트는 어플리케이션이 실행되게 해주는 코드를 말하고 대표적으로 뷰 컨트롤.. 2020. 5. 22.