Web Performance .00 시작하기 전에
Programming/Web2023. 3. 23. 18:10Web Performance .00 시작하기 전에

안녕하세요. RyuWoong 입니다. 이번에 포스팅 할 내용은 Web Performance입니다. JS와 React를 공부하며 내부 로직을 최적화 하는 것 외에, 신경 써야할 것들이 더 있다는 걸 알게모르게 눈치 채고 있었습니다. 우리가 React를 다루면서 re-Rendering이라던지, CSS IN JS를 사용하면 어떤 장단점이 있는지 등에 대해 알아가다 보면, 근본적인 무언가가 연관이 있어서 성능에 영향을 미치고 있다는 느낌을 받게 됩니다. 새로운 방법론이나, 도구가 등장하는 것은 기존의 문제나 불편함을 해소하기 위해 등장한 것이니까요. 이번에는 근본적인 것을 찾아 여정을 떠나 볼까 합니다. 저 같은 Junior 개발자들이나 입문자들에게 도움이 되었으면 합니다. Web Perfomance? Web ..

[GraphQL] GraphQL .00 알아보기
Back-End/Node.js2023. 3. 22. 21:58[GraphQL] GraphQL .00 알아보기

안녕하세요. RyuWoong입니다. 이번에 해볼 이야기는 GraphQL 입니다. React Query와 Component에 대한 공부를 하다보니 한번씩 접했던 단어인데요, GrapQL이 뭔지, 어떤 용도로 쓰이는지 한번 알아보도록 하겠습니다. GraphQL? GraphQL은 Meta(구 FaceBook)에서 만든 Query Language(이하 QL) 입니다. QL이지만, 기존에 우리가 사용하던 SQL과는 꽤 차이가 있습니다. 사용하는 방법부터 용도, 목적이 다릅니다. 한번 살펴볼까요? SQL은 DB에 저장된 데이터를 효율적으로 불러오기위해 사용하는 언어이며 주로 BackEnd에서 사용하고 GraphQL은 Web Client가 서버로부터 효율적으로 데이터를 가져오기 위해 사용하는 언어로 주로 FrontE..

Next.js에서 React Query 사용하기.
Front-End/Next.js2023. 3. 19. 18:17Next.js에서 React Query 사용하기.

안녕하세요! RyuWoong 입니다. 이번에는 React Query에 대해 조금 이야기 해볼까합니다. 사실 제가 Nextjs에 React Query 쓰면서 옛날 버전 문서보고 삽질해서 그런거 아님. 여튼 시작하시죠. 전역 상태 관리 사실 React Query를 이야기하기 전에 상태 관리 이야기부터 했어야 했을 것 같다는 생각이 드는데, 과거에 상태관리 라이브러리가 한정적인 시절 Redux는 React를 다룬다면 꼭 알아야했을 정도로 중요한 상태관리 라이브러리였습니다. (과거엔 이런 상태 개념을 익힌다는 것이 React의 진입장벽을 높인다는 이야기가 많았죠.) 그리고 전역상태관리라는 것이 왜 필요하게 됐는지에 대한 이야기를 보면 필수적인 요소로 보이구요. 무엇이든 그렇지 않겠냐만, 잘 사용하지 못하면 전역..

HTTP 그리고 1.0, 1.1, 2.0
Programming/Web2023. 3. 15. 20:32HTTP 그리고 1.0, 1.1, 2.0

안녕하세요 RyuWoong 입니다. 이번에 다뤄볼 이야기는 HTTP에 관한 이야기 입니다. 우연히 접한 이야기였는데, 흥미로워서 포스팅하게 됐습니다. HTTP 단순하게 프로토콜인줄 알았는데 버전도 있고 버전에서 어떤변화가 있는지 함께 알아볼까요? HTTP HTTP는 Hyper Text Transfer Protocol의 약자로 HTML문서와 같은 리소스를 가져올 수 있도록 해주는 프로토콜이자 웹에서 이루어지는 데이터 교환의 기초입니다. 아주 과거에 웹사이트는 순수하게 Text로 이루어진 방식이였다고 합니다. Hyper Text라는 것이 등장하고, 이때 우리가 아는 웹사이트의 시초가 되었습니다. 사이트 내에서 '클릭'을 해 다른 페이지로 이동하는 지금은 별거 아닌 기술 같지만, 이 시절엔 엄청난 혁신이였죠...

Javascript로 백준 풀기.
Programming/Algorithm2023. 3. 13. 21:12Javascript로 백준 풀기.

안녕하세요. RyuWoong입니다.이제까지 Programmers에서 알고리즘 문제를 풀어 왔는데, 깃헙 프로필을 꾸미면서 티어를 노출시키는 기능을 써먹어야겠다고 생각이 들었습니다. 그래서 백준을 풀어보려고 합니다! 그러면서 어떻게 문제를 제가 풀고 제출하는지 한번 슥, 보여드리려고 합니다.준비하기.우선 Algorithm이라는 폴더를 만들어 내부에서 관리하려고 합니다.Algorithm 폴더 내에는 Question과 Utils 폴더를 추가로 만들어줬습니다. 그리고 Question 폴더 내에는 문제번호로 폴더를 만들고 각문제 번호마다, a.js 와 q.txt 를 만들었습니다.여기서 q.txt는 문제의 테스트케이스가 들어가는 곳이고, a.js는 제가 문제를 풀이하는 자바스크립트 코드를 적는 파일입니다. 간단하..

image