전체 글(112)
-
[TIL] Redux 1. 순수 JS에서 Redux와 상태관리 wtih. store와 reducer
이 시리즈는 노마드 코더님의 "초보자를 위한 리덕스 101"을 보고 배운 내용을 정리합니다. 비약이나 틀린 내용이 있다면 언제든 댓글로 알려주세요..! (매우 환영입니다😀) [시작하기 전에] 이번 1편은 React가 아니라 순수 JavaScript 환경에서 실습을 해봅니다. 이후에 React-Redux도 다루니 다른 편을 참고해주세요! 🎛️ Redux: JS에서 쓰는 상태관리 컨테이너 Redux는 그냥 저냥 듣기로는 React에서 쓸 수 있는 공용 저장소고, Props drilling같은 상태관리를 도와준다고 알고 있었다. React 뿐 만 아니라 JavaScript 전반적으로 쓸 수 있는 "상태 관리" 컨테이너라고 한다. 구글링으로 상태관리 관련된 포스트를 보면 블로거 분들이 각자 상태관리를 자신만의 ..
2022.10.11 -
[TIL] HashLink의 사용법
공부한 내용을 작성합니다. 틀렸거나 직관에 의한 비약이 내용 중에 심심치 않게 들어갈 수 있으니 피드백 주시면 감사한 마음으로 수정하겠습니다. 엄청 나게 긴 블로그 콘텐츠나, 조직도 처럼 많은 양의 데이터를 한 페이지에 보여줄 때 UX를 위해 콘텐츠 네비게이터라는 걸 둔다. 이 콘텐츠 네비게이터는 두 가지 특성이 있다. 1. 브라우저 안에서 스크롤 이동이 있다. 2. hash url을 더해준다. 잘 보면 `/doc/en#${HASH}`로 콘텐츠가 이동하는 걸 확인할 수 있다. React에서는 이런 기능을 구현하기 위해 HashLink를 제공하지만.. 1. HashRouter 요약하면, hash url은 클라이언트 쪽의 라우팅을 담당하던 기능이었지만, 요새는 그냥 디자인 목적으로 사용된다는 것. 근데 Re..
2022.10.09 -
[JS] 할인행사: 2중 loop까지만 돌리면 ok
이거 옛날에 풀었던거 같은데새로 나왔네용..뭐지..? 반복문을 최대한 줄이려고 노력하면 풀립니다. 문제 요약 품을 할인하는 행사를 합니다. 할인하는 제품은 하루에 하나씩만 구매할 수 있습니다. 알뜰한 정현이는 자신이 원하는 제품과 수량이 할인하는 날짜와 10일 연속으로 일치할 경우에 맞춰서 회원가입을 하려 합니다. 예를 들어, 정현이가 원하는 제품이 바나나 3개, 사과 2개, 쌀 2개, 돼지고기 2개, 냄비 1개이며, XYZ 마트에서 15일간 회원을 대상으로 할인하는 제품이 날짜 순서대로 치킨, 사과, 사과, 바나나, 쌀, 사과, 돼지고기, 바나나, 돼지고기, 쌀, 냄비, 바나나, 사과, 바나나인 경우에 대해 알아봅시다. 첫째 날부터 열흘 간에는 냄비가 할인하지 않기 때문에 첫째 날에는 회원가입을 하지 ..
2022.10.08 -
[JS] 혼자 놀기의 달인 - union-find를 써보세요.
간만에 코테 문제 푸네요.새로나온 level2 문제인 혼자놀기의 달인입니다.find 알고리즘을 쓰면 쉽게 해결 가능합니다.같이 보죠! 문제 요약 혼자서도 잘 노는 범희는 어느 날 방구석에 있는 숫자 카드 더미를 보더니 혼자 할 수 있는 재미있는 게임을 생각해냈습니다. 숫자 카드 더미에는 카드가 총 100장 있으며, 각 카드에는 1부터 100까지 숫자가 하나씩 적혀있습니다. 2 이상 100 이하의 자연수를 하나 정해 그 수보다 작거나 같은 숫자 카드들을 준비하고, 준비한 카드의 수만큼 작은 상자를 준비하면 게임을 시작할 수 있으며 게임 방법은 다음과 같습니다. 준비된 상자에 카드를 한 장씩 넣고, 상자를 무작위로 섞어 일렬로 나열합니다. 상자가 일렬로 나열되면 상자가 나열된 순서에 따라 1번부터 순차적으로..
2022.10.07 -
git bash로 ssh 생성하기
github page는 일반적으로 static한 화면을 보여주기 때문에 일반적으로는 ssh가 딱히 필요가 없다. 굳이 쓰려면 github의 id/pw 없이 push하기..? deeplink를 사용하려면 ssh가 꼭 필요하다는 슬픈 사실..😥 1. ssh key 생성하기🆕 실행은 git bash에서! ssh-keygen -t ed25519 -C "YOUR_EMAIL@HOST.COM" 두번째 argv로 있는 ed25519는 key의 암호화 방식을 의미한다. 이 속성 말고도 RSA라는 오래된 방식도 있는데, 암호학이 뭔지도 모르겠고.. 두 방식의 차이는 이렇다. ed25519방식이 rsa에 비해 속도도 빠르고, 파일크기도 작고, 공개 키/개인키도 작다. (공개키는 400 bytes : 100 byes 정도) ..
2022.10.04 -
[React] github page 그리고 react-router-dom
deeplink를 사용해볼 겸 간단하게 배포를 해봐야했다. static 웹페이지라면 github에 간단하게 배포를 해볼 수 있기 때문에 시도를 해보려고 했으나 뜻밖에 react-router와 github page에 대해서 공부하게 된 내용을 정리해보려고 한다. 프로젝트 별 Github Page 깃헙에서 새로운 레포를 만든 다음, 그 레포 이름을 `${MY_GITHUB_ID}`.github.io 이렇게 만들어주면 배포될 수 있는 페이지를 볼 수 있다고 알고 있다. 라우팅 되는 주소는 당연히 루트 주소! 루트 주소에 만들어도 꽤 유용하지만, 매번 다른 프로젝트를 만들 때 마다 루트를 태워보내는건 무척 비효율적이다. 이번 내 프로젝트 명이 "Mintty" 이니, 나의 경우에는 howdyfrom2019.gith..
2022.10.03