분류 전체보기
-
Javascript - 무한 스크롤 만들기Javascript 2023. 7. 17. 01:26
🔔 서론 인스타그램, 트위터, 페이스북 등의 sns를 이용하다 보면 스크롤을 내릴 때 일정 개수 이상의 피드를 보고나면 로딩중이라는 ui가 표시되면서 새로운 피드를 불러오는 경험을 겪어본 적이 있을 것이다. 수십 수백개의 데이터를 한번에 불러오면 사용자에게 큰 부담을 주기 때문에 소수의 데이터만 미리 불러두고 스크롤을 하면 추가로 데이터를 불러오는 방식으로 무한으로 스크롤을 할 수 있는 것이다. 오늘 알아볼 내용은 무한 스크롤을 구현하는 내용이다. 무한 스크롤이란, 컨텐츠를 페이징하는 기법 중 하나로 아래로 스크롤하다 컨텐츠의 마지막 요소를 볼 즈음 다음 컨텐츠가 있으면 데이터를 불러오는 방식으로 주로 sns에서 사용된다. 무한 스크롤 구현 방식은 크게 두 가지로 알아보자. window의 scroll 이..
-
typescript - exercises 4일차Typescript 2023. 7. 13. 16:36
🔔 서론 원래 남은 4문제를 이틀에 걸쳐 두 문제씩 풀기로 계획했었는데, 알고보니 16번 문제가 없어서 3문제를 이틀에 걸쳐 풀기엔 낭비인 것 같아서 남은 문제를 모두 풀기로 했다.. 파이팅.. https://typescript-exercises.github.io/ TypeScript Exercises A set of interactive TypeScript exercises typescript-exercises.github.io 이번 포스트는 위 사이트의 13~15번 문제를 풀며 각 문제 풀이에 해당하는 핵심 키워드 개념을 정리하는 글이다. 🥁 13번 interface merging을 사용해 index.d.ts 파일을 완성시키는 문제이다. 🌈 Interface Merging interface mergi..
-
typescript - exercises 3일차Typescript 2023. 7. 12. 15:47
🔔 서론 어느덧 3일차에 접어든 typescript exercises 스터디, 아마 오늘이 가장 고비가 아닐까 싶다. 총 16문제를 5일에 걸쳐 4, 4, 4, 2, 2 문제씩 풀기로 했기때문에 난이도가 어느정도 높으면서 많은 문제를푸는 마지막 날이기 때문이다. 문제를 접하고나니 역시 예상대로 난이도가 너무나도 높아서 좌절하고 싶었지만.. 그만큼 아직 배울게 많이 남아 있다는거니까 아무래도 좋다.. 중요한건 꺾이지 않는 마음일 것. https://typescript-exercises.github.io/ TypeScript Exercises A set of interactive TypeScript exercises typescript-exercises.github.io 이번 포스트는 위 사이트의 9~12번..
-
typescript - exercises 2일차Typescript 2023. 7. 11. 16:38
🔔 서론 1일차가 지나고 다음 문제를 풀려는데 5번부터 막혀 부족함을 깨달아서 상당히 스스로에게 화가 난 상태로 문제를 풀어냈다... (화가 난 상태면 내가 뭘 할 수 있는데ㅋㅋ) https://typescript-exercises.github.io/ TypeScript Exercises A set of interactive TypeScript exercises typescript-exercises.github.io 이번 포스트는 위 사이트의 5~8번 문제를 풀며 각 문제 풀이에 해당하는 핵심 키워드 개념을 정리하는 글이다. 🥁 5번 Utility type을 적절히 사용하여 타입의 변환을 주는 문제이다. 문제의 요구사항에서 '필요한 기준'만 통과 되게끔 filterUsers를 변경해야한다 라고 서술했고,..
-
typescript - exercises 1일차Typescript 2023. 7. 11. 03:41
🔔 서론 데브코스 노션 클론 과제가 끝나고 잠깐의 숨 돌릴 틈이 주어진 어느 날, 같은 팀원이 한 가지 제안을 했다. 곧 typescript 강의가 시작되기 전 개념공부를 하면서 문제를 풀어보고 개념을 정리해 발표하는 스터디를 해보는게 어떻겠냐고.. typescript 공부를 안그래도 하려던 참이었기에 기쁜 마음으로 참여를 희망했다. https://typescript-exercises.github.io/ TypeScript Exercises A set of interactive TypeScript exercises typescript-exercises.github.io 팀원분이 "위 사이트의 문제를 그래도 최소 12번까지는 풀 수 있으면 내 기술 스택에 typescript를 자랑스럽게 적어도 된다"라는 ..
-
프로그래머스 데브코스 - 6월 회고회고 2023. 7. 5. 23:33
🔔 서론 프로그래머스 데브코스를 시작한지 어느덧 한 달 째, 짧다면 굉장히 짧고 길다면 상당히 많은 것들을 할 수 있는 시간이었다. 사실 데브코스를 바로 합격한 것은 아니고 추가합격으로 들어왔었기에 상당히 들뜬 마음으로 시작했던 기억이 난다. 하지만 의욕만 앞서서는 오히려 일을 그르칠 수 있기에 '내가 할 수 있는 것만 하자' 라는 마음을 가지고 데브코스에 임했었다. 매니저님께서도 데브코스라는 과정이 막 엄청나고 듣지못하면 큰일이 나버리는 교육이라기보다는 흘러가듯이 들으면 좋고 아님 말고 의 마인드로 생각해주시면 좋겠다라는 말씀을 하셨기에 더욱 편안하게 임할 수 있었다. 이번 글은 6월 한달동안 데브코스를 진행하면서 주차별로 배운것, 느낀점 그리고 아쉬웠던 점들을 토대로 성장한 것을 확인하는겸 기록하는 ..
-
Javascript - Optimistic Update 개념 정리Javascript 2023. 6. 25. 01:52
🔔 서론 오늘 알아볼 키워드는 Optimistic Update 라는 개념이다. 데브코스에서 api와 통신하는 Todo App 실습을 진행하면서 알게 된 키워드인데, 데브코스를 진행하면서 모르고 있던 키워드들이 계속 있는 것을 보니 역시 공부해야할 개념이 아직도 너무 많다는 걱정 반, 그래도 데브코스덕에 하나 또 배워간다는 안도감 반 씩 들었다.😜 이번에는 가볍게 개념정리하는 포스팅이므로 편하게 보도록하자. 📌 낙관적 업데이트란? 사용자는 브라우저의 기능에 액션을 취했을 때, state의 값이 변하면 서버에게 알려야하고, 화면의 값 역시 바뀌어야한다. 이를 업데이트라고 표현하는데 이 업데이트는 낙관적 업데이트(Optimistic Update)와 비관적 업데이트(Pessimistic Update) 두 가지로..
-
Javascript - Event DelegationJavascript 2023. 6. 23. 22:53
🔔 서론 프로그래머스 데브코스 Javascript 심화과정을 수강하던 중 생소한 키워드를 알게 됐다. 그것은 Event Delegation 즉, 이벤트 위임 이라는 개념이었다. 강사님께서 예시 코드를 보여주시면서 이벤트 델리게이션의 개념을 알아두는 게 정말 중요하다고 스치듯 말씀하셨지만, 내 귀에는 엄청 강조하듯이 들린 것 같은 느낌이었고 마침 처음 듣는 개념이었기에 정리를 하고자 했다. Event Delegation에 대해 알기 위해서는 Event Flow, Event Capturing, Event Bubbling등 여러가지 개념을 또 알아야 했기에 이번 포스팅에서 모두 알아보도록 하자. 📌 Event Delegation이란? 이벤트 델리게이션은 Javascript의 대표적인 디자인 패턴 중 하나이다...