WEB Dev(161)
-
[ToyProject-Todomate] 투두메이트 클론 프로젝트 20
🔷 CloneTodo ☑ - Todomate Clone Project | Team CloneMate CloneTodo : 많은 사람들이 사랑하는 투두메이트를 클론하여 웹 서비스를 배포해보는 프로젝트 이제 즐거운 마크업 시간은 가고 진짜 기능들을 구현해놔야 하는 시점이 된 것 같다. 이제 Main의 Feed 부분을 만들어야 하는데, 이 Feed는 Goal(목표)의 하위에 들어가는 todo를 입력하고, 관리하는 부분이라 Goal 페이지 먼저 만들어야 한다는 사실을 깨달았다. 이런 순서도 없이 마구잡이로 만드려고 하니 오히려 내 Todo가 정리가 안되는 느낌이다. 그래서 회피로 가득차는 바람에 어제도 조금 코드를 건드렸지만 기록을 남기지 못해서 오늘 몰아서 기록한다. 우선 주말 계획은 Goals ▶ Feed ..
2022.01.02 -
[Javascript] sessionStorage 사용하기 (setItem, getItem)
업무가 커머스 페이지 유지보수이기 때문에 세션을 활용해서 화면을 구현해야 하는 일이 생각보다 많다. 로그인한 회원의 정보를 가져다 쓰는 일이 많기 때문에 localStorage 보다 sessionStorage를 사용한다. .setItem으로 세션에 넣고, . getItem으로 가져오는건 아는데 활용법을 가끔 까먹어서 메소드 정리 겸 포스팅한다. 로컬 스토리지Local Storage | 세션 스토리지Sesstion Storage 공통점 - 로컬스토리지와 세션스토리지 모두 '웹 스토리지 객체 Web storage object' 이다. - 브라우저에 키 - 값 (Key - Value) 쌍을 저장해서 데이터로 사용할 수 있다. - 저장되는 값은 객체가 아닌 텍스트다. (객체를 주로 저장하는데 이것도 텍스트로 바..
2021.12.30 -
[VSCode] VSCode 개별 창 테마 바꾸기
EC2 가상머신을 ssh로 받아서 작업하는 VSCode 하나와 카페24 테마를 받아다 작업하는 VSCode 하나를 번갈아가면서 작업하다보니 뭐가 뭔지 헷갈려서 테마 색을 바꾸고 싶었는데, 왼쪽 하단의 톱니바퀴 설정으로 테마를 변경하면 모든 VSCode 창이 바뀌어버린다. 이럴때 설정하는 법은 '작업영역별' 테마 지정으로 해결! 1. VSCode의 설정으로 들어간다. 파일 > 기본 설정 > 설정 혹은 Ctrl + ,(쉼표) 로 설정창으로 이동한다 2. 설정에서 상단에 원하는 작업 영역을 선택한다. 사용자 : 기본 / 원격 : 나의 경우 ssh로 연결한 EC2 / 작업 영역 : 지금 켜 둔 VSCode의 작업 영역 사용자를 선택하면 현재 열려있는 창은 물론 전역 설정을 바꾸는 것이다. 현재 켜 둔 작업 영역..
2021.12.29 -
[ToyProject-Todomate] 투두메이트 클론 프로젝트 19
🔷 CloneTodo ☑ - Todomate Clone Project | Team CloneMate CloneTodo : 많은 사람들이 사랑하는 투두메이트를 클론하여 웹 서비스를 배포해보는 프로젝트 오늘의 할 일은 Explore의 달력부분을 만드는 일이다. 달력의 경우 NHN TOAST에서 제공하는 Calendar UI 라이브러리를 사용하기로 하였다. 그래서 TOAST의 공식문서에서 적용방법을 따라해본다. 1. 설치 npm 이나 bower, CDN을 통해 라이브러리를 이용할 수 있다. 리액트 프로젝트이기 때문에 간편한 CDN 보다는 npm을 통해 패키지를 설치하자. npm install --save @toast-ui/react-calendar 2. Calendar 패키지와 CSS를 import 해온다. ..
2021.12.28 -
[매일코딩-프로그래머스] 완주하지 못한 선수 02 + Hash란?
출근하면서 생각해봤는데, sort 하고 순서대로 비교하는 것도 답은 아닌 것 같았다. 우선 partcipant에 값이 두 번 이상 나오는지 확인해야 하지 않을까? 아무리 생각해도 뭘 써야하는지 모르겠어서 우선 배열 관련 메소드를 다 확인해본다. 이러면서 공부하는거지 뭐 배열 객체 메소드 - JavaScript 배열 객체 메소드 2019-08-01 18:35:54 배열 객체 메소드 Array 객체가 갖고 있는 메소드들에 대해 알아봅니다. 함수들을 이용하여 배열을 효과적으로 사용할 수 있습니다. 함수의 종류가 많고, 활용 opentutorials.org 그런데 이 문제가 '해시' 카테고리에 있는 문제이기 때문에 '해시'라는 개념을 적용해야 한다는 조언이 있었다. 해시...? 해시가 무엇인지 알아보자 해시 H..
2021.12.28 -
[ToyProject-Todomate] 투두메이트 클론 프로젝트 18
🔷 CloneTodo ☑ - Todomate Clone Project | Team CloneMate CloneTodo : 많은 사람들이 사랑하는 투두메이트를 클론하여 웹 서비스를 배포해보는 프로젝트 MainNavBar의 Drawer 메뉴를 만들었으니, 이제 Content 부분의 여러 기능들을 해결해봐야겠다. 이번주는 캘린더와..... ..... 투두.... Feed 부분을.... Explore → Feed 순으로 작업하려고 한다. MUI는 진심으로 미쳤다. 이 부분에 쓸 컴포넌트도 이미 만들어져 있다. 바로 Avatar다. 이 Avatar 컴포넌트에서 Letter Avatar 컴포넌트를 사용해본다. 캘린더 상단의 저 부분은 내가 팔로우한 사람의 닉네임의 앞글자가 표시되는 곳이다. Avatar 패키지를 i..
2021.12.28