haranglog haranglog

리액트

• ✔ 우아한 테크러닝 3기: React & TypeScript 5회차

  우아한 테크러닝 3기 2020. 9. 19. 19:03

  ✌ 9월15일 (화) 우아한 테크러닝 3기 5회차 강의 정리 🚀 5회차 강의 목표 javascript로 만든 Redux 리뷰 Redux의 비동기 Redux 미들웨어 알아보기 💻 Redux 리뷰 2회차때 만든 리덕스를 사용하여 store와 reducer 생성 해준다. 자세한 내용은 위 링크 참조 🙏 index.js import { createStore } from "./redux"; function reducer(state = { counter: 0 }, action) { switch (action.type) { case "inc": return { ...state, counter: state.counter + 1 }; default: return { ...state }; } } const store = ..

  Read More
• [React]리액트에서 react-draft-wysiwyg , DraftJS 사용하여 에디터(Editor) 적용 후 Redux로 상태관리하기

  React 2020. 8. 31. 23:32

  ✔ 개요 블로그 글쓰기나 기타 게시글을 쓸 때 textarea로 작성을 하면 많이 밋밋하고, 기능적으로 많은 구현을 하기 힘듭니다. 그렇기 때문에 글쓰기가 필요하고 게시글을 만들 때 오프소스 에디터들을 사용하여 좀 더 많은 기능의 게시글을 작성할 수가 있습니다. 많은 오프소스 에디터들 중에 react-draft-wysiwyg(리액트드래프트위지윅) 에디터를 사용해봤습니다. 다른 오픈소스 기반 리액트 에디터의 종류를 사용해보고 싶으면 참고 사용하면서 react-draft-wysiwyg의 장점은 기본적인 사용은 쉽고, 유명한 페이스북에서 관리하는 에디터인 draft.js를 사용하기 쉽게 리액트로 구성한 것입니다. 하지만, 기능적으로 디테일이 부족하다는 점이 있다고 느꼈습니다. 예를 들어, 한글을 입력할 때 바..

  Read More
• [React] 리액트에서 react-moment, moment.js 사용하여 실시간으로 변경되는 시간 만들기

  React 2020. 8. 23. 16:30

  Moment.js는 현재 유지 관리 모드에 있는 레거시 프로젝트입니다. 다른 라이브러리를 사용하시는 것을 추천드립니다. (참고) 다른 대안 라이브러리 (2023.02.25 수정) ✔ moment.js moment.js는 시간이 포함된 데이터를 받아 조작해야 할 경우 가장 많이 사용되는 편리한 라이브러리입니다. 스터디를 모집하는 사이드 프로젝트를 만들 때 사용하였습니다. 현재 시간에 따라서 스터디 신청 마감, 신청중인지 에 따라 실시간으로 변경이 되게 많드는 것이 목표였기 때문에 moment.js를 사용하였습니다. moment.js는 워낙 많이 사용되기 때문에 공식 문서 뿐만 아니라 잘 설명된 블로그들이 많이 존재하기 때문에 moment.js를 사용하는 자세한 방법은 생략하겠습니다. 🔸 moment 라이브..

  Read More