TodayILearn

이전 해커톤을 할 때 chart.js를 잠깐 쓴적이 있다. 아주 잠깐. 코로나 감염자 api를 이용하여 지역별로 감염된 사람들을 보여주는 간단한 차트였는데 이렇게 현재까지 감염된 사람들을 보여주는 차트였다. 짧은 시간동안 진행하는 해커톤이어서 chart.js를 정확히

기존의 코드에서 모바일 뷰 포트로 변경되면 네비게이션을 오른쪽에 숨겼다가 버튼 클릭하면 보여주는 식의 css를 짰다. 그런데 왠걸 뷰포트를 변경해보니 transform: translateX(100%);에 있어야할 네비게이션이 0 > 100%로 움직이는게 보이지

"웹 소켓을 이용한 카톡 프로젝트...","웹소켓을 이용한.." 이런 이야기를 많이 들어 봤는데 도대체 웹 소켓이란 무엇인가? 먼저 웹소켓이 만들어진 배경을 알아보자. 인터넷이 나오고 http를 통해서 통신을 하던 시절..서버로 부터 데이터를 가져오기 위해서는 오로지

오늘은 socket.io를 이용하여 실시간 채팅앱을 개발해보려 했다. 튜토리얼 진행중 socket.broadcast.emit()을 사용하면 요청을 날린 클라이언트를 제외한 나머지 클라이언트에 메시지를 보낼 수 있다고 해서 사용했지만, 이상하게 메시지를 보낸 클라이언트에

웹소켓을 조금씩 공부하다보니 조금 더 많은 브라우저에서 사용할 수 있는 webSocket.io에 대해서 공부하고 싶어졌다. 조금 더 공부하면 카톡같은 채팅 어플을 만들 수 있을 지 않을까. 일단 지금은 이 지식이 고파졌다. webSocket.io시작 일단 이것도 그냥

이번 시간에는 내가 만들었던 어때시네마에서 사용한 기술인 redux에 대해서 정리하려 한다. 그럼 먼저 redux가 뭔지 부터 살펴보도록 한다.이걸 알아 보기 위해 일단 redux의 홈페이지로 갔다. 어떤 라이브러리든 메인 홈페이지에 가면 이게 뭔지 정의해두기 마련이지

인기있는 라이브러리는 사용해보고 싶기 마련이다. 그래서 내맘대로 지지고 볶을 수 있는 내 포트폴리오 페이지에서 한번 찍먹(맛보기) 해보기로 했다. styled-component란? 자 그럼 이게 뭔지 알려면 공홈에서 확인해보는게 인지상정이다.

지금까지 CRA를 이용하여 클라이언트 사이드의 웹페이지만을 제작해보았다. 물론 SPA는 좋은 도구 이지만, 일음 함에 있어서 목적에 따라 적합한 도구를 사용해야 하지 않겠는가? 숟가락으로 병뚜껑을 딸수 있다고 병따개 냅두고 숟가락만 쓸수는 없는 일 아니겠는가!그러니 일

오늘은 SPA의 단점을 보완할 기술인 코드 스플리팅에 대해 공부해봤다. 여기서 말하는 SPA의 단점이란 무엇일까..바로 보이지도 않는 페이지 등등의 로딩때문에 초기 로딩이 느려진다는 점이다. 예를 들어 메인 페이지에 정보가 필요한 사용자에게는 다른 페이지의 정보는 필