목록React (3)
똑같은 삽질은 2번 하지 말자
개요어떤 기업의 코딩테스트로 Nextjs + Firebase로 인증시스템과 게시판을 간단히 만들어보라는 코딩테스트?가 있어서 만들었던 과정을 기록해보고자 한다. 완성된 코드는 밑의 리포지토리 참조https://github.com/gmldnjs26/playground-nextjs-firebase GitHub - gmldnjs26/playground-nextjs-firebaseContribute to gmldnjs26/playground-nextjs-firebase development by creating an account on GitHub.github.com 배포한곳https://playground-nextjs-firebase-8f65.vercel.app/ Firebase의 설정https://conso..
Redux? Flux라는 개념을 구현한 기술 Redux의 탄생배경 앱의 규모가 크게되면 MVC 모델의 데이터흐름을 포작하기 어려운 점때문에 데이터 흐름을 포착하기 쉽게 하기위해 FLUX패턴이 등장하였다. 처음에는 앱의 규모가 작아 데이터의 흐름을 포착하기 쉬웠지만.... 앱의 규모가 커지면 커질수록 모델과 뷰의 의존성이 커진다.. 그래서 어느 하나의 모델의 변화로 몇개의 뷰가 바뀌는지 뷰의 변화로 몇개의 모델이 바뀌는지 예측하기 어려워졌다. https://bestalign.github.io/translation/cartoon-guide-to-flux/ Flux로의 카툰 안내서 원문: https://medium.com/code-cartoons/a-cartoon-guide-to-flux-6157355ab20..
개요 React JS 를 공부하면서 기본을 정리해두고자 작성 React.js 최신의 다채롭고 복잡한 사용자 인터페이스(SPA)를 쉽게 구축할 수 있게 도와주고 고수준의 구문을 제공해서 선언형 방식, 선언형 컴포넌트 중심의 방식으로 코드를 구축해 나갈수 있다. 리액트의 선언형 방식에 대해 설명을 덧 붙이자면 div.root에 p태그로 "빅맥 먹고싶다" 라는 내용을 추가하고 싶을때 javascript로 하면 const para = document.createElement("p") para.textContext = '빅맥 먹고싶다' document.getElementById("root").append(para) 이렇게 한줄한줄 명령형으로 동작을 지시해야 하는데 리액트로 할 경우에는 function App() ..