Web (45) 썸네일형 리스트형 [CSS] flex “flex” 검색결과 – CODING FACTORY “flex” 검색결과 – CODING FACTORY Alert Alert는 방문자에게 특정 메시지를 보여줄 때 주로 사용합니다. 메시지에 맞게 색을 고를 수 있으며, 닫기 버튼을 추가할 수 있습니다. Provide contextual feedback messages for typical user actions with the ha www.codingfactory.net flex 수평 수직 스타일 구성에 유리한 기능 Container 속성과 Container의 내부 items 속성으로 구성 Container 속성 Items 속성 [CSS] float CSS / float와 overflow – CODING FACTORY [CSS] overflow CSS / overflow / 내용이 요소의 크기를 벗어났을 때 처리 방법 정하는 속성 – CODING FACTORY [CSS] box-sizing CSS / box-sizing / 박스의 크기를 어떤 것을 기준으로 계산할지를 정하는 속성 – CODING FACTORY [React] 로그인 / 회원가입 ★ React-router에서는 말고 를 써야 한다. 사용시 페이지 새로고침이 일어나므로 화면만 변경되고 데이터 변경이 없는 를 사용해야 한다. ★ front / back-end를 localhost로 사용할때는 로그인 된 정보를 메모리에 저장하고 있기 때문에 서버를 재시작해야 로그인 정보가 없어짐 ★ back-end를 끄기 힘든 상황이면 front에서 application에 들어가서 cookie를 로그인 정보를 삭제 ★ webpack-dev-server에서 proxy 옵션을 사용하여 fake localhost 주소를 만들어 cors 문제를 해결 할 수 있음 ★ front 개발자가 로그인 성공을 알 수 있는 데이터는 응답으로 온 데이터의 유/무, 로그인시에는 데이터를 front에서 저장하고 있고 로그아웃시.. [http] http 헤더 정보 의미 HTTP Header - 공통 헤더 Date : 현재시간 (Sat, 23 Mat 2019 GMT) Pragma : 캐시제어 (no-cache), HTTP/1.0에서 쓰던 것으로 HTTP/1.1에서는 Cache-Control이 쓰인다. Cache-Control : 캐시 제어 + no-store : 캐시를 저장하지 않겠다. + no-cache : 모든 캐시를 쓰기 전에 서버에 해당 캐시를 사용해도 되는지 확인하겠다. + must-revalidate : 만료된 캐시만 서버에 확인하겠다. + public : 공유 캐시에 저장해도 된다. + private : '브라우저' 같은 특정 사용자 환경에만 저장하겠다. + max-age : 캐시의 유효시간을 명시하겠다. Transfer-Encoding : body 내용 자.. [React] http 비동기 요청 - 비동기요청을 무조건 redux에서 처리하는 것이 아닌 component 내에서만 쓰이는 비동기 처리의 경우는 component내에서 코딩하여 처리하는것이 코드가 간결해짐 - React에서 보통 비동기요청은 axios를 사용 - 보통 back-end 개발자가 API list를 주면 그에 맞춰 개발을 한다 - cors, localhost 주소가 다를 경우 나올수 있는 error, back-end쪽에서 서버 포트가 달라도 받을수 있도록 설정을 하거나 webpack dev server에서 proxy를 설정하여 해결 할 수 있다 - error 데이터는 error.response.data로 응답이 온다 - 비동기 요청의 안에서 쓰이는 setState의 경우 함수 초기에 초기화를 따로 해주는 것이 좋다. 요청을 .. [React] 커스텀 훅 및 useCallback Custom hook을 사용하여 hook을 custom 할 수 있다 Single Page Application에서 쓰이는 tag의 경우 submit 동작 시 e.preventDefault()를 필수로 추가해야한다. useCallback은 사용시 함수를 기억하기에 배열 요소에 바뀌는 값들을 꼭 추가해줘야 한다. - 매번 함수 component가 render시 함수가 새로 생성되며 함수를 포함한 자식 component도 계속해서 render 됨 - re-render가 발생해도 실제로 화면을 계속 그리는건 아니지만 비교검사를 하기 때문에 사용자 경험에 영향을 미침 - useCallback 배열 요소에는 함수를 기준으로 외부 변수에서 바뀌는 값이면 적어주고 내부 변수일 경우는 적지 않아도 됨 / 순수함수일 경우.. [React] 라우터 및 코드 스플릿 React Router React로 블로그 만들기 14 : 리액트 라우터 (React Router. 1) : 네이버 블로그 (naver.com) React로 블로그 만들기 14 : 리액트 라우터 (React Router. 1) 본격적인 블로그 만들기에 앞서 리액트 라우터 (React Router)를 추가해보겠습니다. 14-1. React-Route... blog.naver.com Code splitting / lazy Lazy Loading & Code Splitting | DailyLog (ui-tricks.netlify.app) Lazy Loading & Code Splitting How to set up lazy loading components in React ui-tricks.netlify.app [React] React에서 index.html( css) React를 사용하더라도 web이 결국 running하는 파일은 index.html 파일이다. 성능, 검색 최적화시 핵심 css는 index.html에 inline으로 넣는 것을 google에서도 권장한다. 이전 1 2 3 4 5 다음
