분류 전체보기304 [4 - 2] Yarn으로 프로젝트 만들기 내가 현재 사용하는 커맨드(명령 프롬트) 툴은 윈도우용 "cmder"이다. ** 기본 디렉토리 세팅은 내가 만들어둔 마스터 디렉토리로 경로를 세팅해준다. 그 후 하위 디렉토리로 프로젝트 폴더들을 만들어 프로젝트를 진행한다. ** 기본적인 커맨드 명령어들: cd: 현재 디렉토리 이름을 보여주거나 바꾼다. 다른 디렉토리로 이동할 수 있다. (cd .. 는 상위 폴더로 이동시켜준다.) cls: 화면을 지운다. dir: 디렉터리에 있는 파일과 하위 디렉터리 목록을 보여준다. mkdir: 디렉터리를 만든다 rename: 파일 이름을 바꾼다. 1. cmder에서 프로젝트를 생성하고자 하는 master 디렉토리로 이동한다. yarn create react-app 폴더명(영어) 터미널은 항상 2개를 열어둔다. a. c.. 2020. 10. 26. :root selector and var( ) :root 가상 선택자의 특징 1. 보다 명시도가 낮다. 2. global 하다. 3. var()과 함께 자주 쓰인다. 4. :root 선택자 안에서 변수명을 선언한다. 반드시 "--"를 앞에 쓰고 변수명을 지정해야 한다. (ex: --변수이름) 주의!! 일반 선택자 안에서도 "--변수이름"을 선언할 수 있지만. 해당 선택자와 그 자식들 안에서만 적용된다. 그렇기 때문에 일반 선택자 안에서는 변수를 선언하지 않는다. var함수를 활용해 선언된 변수값을 사용할 수 있다. var(변수, 새로운 값)의 형태로 변수값을 "override(덮어쓰기)"할 수 있다. [fallback] ㄴ보통 이 방법은 선언된 변수에 값이 제대로 작동되지 않았을 경우를 대비위함인데, 애초에 :root에 값이 제대로 적용되었는지 확인.. 2020. 10. 8. [선택자] 띄어쓰기, 조합자의 차이 div p : div 내에 있는 모든 P div > p : div 바로 근접해 있는 P 2020. 10. 8. 명시도(Css cascading 결정하는 요소) 명시도란 브라우저가 어느 요소와 가장 연관된 속성을 찾는 수단으로, 이렇게 찾은 속성이 해당 요소에 적용됩니다. 명시도는 여러 종류의 CSS 선택자로 구성된 일치 규칙에 기반합니다. 주의: 문서 트리 내 요소의 근접도(proximity, 가까움)는 명시도에 영향이 없습니다. inline > 아이디(#) > 클래스(.) > 요소(element) 숫자로 명시도를 계산할 수 있다. (0 0 0 0) 선택자 유형 아래 선택자는 유형별로 명시도를 증가시킵니다. 유형 선택자(h1 등) 및 의사 요소(:before 등). 클래스 선택자(.example 등), 속성 선택자([type="radio"] 등), 의사 클래스(:hover 등). ID 선택자(#example 등). 전역 선택자(*), 조합자(+, >, ~, '.. 2020. 10. 8. [react-router nesting 연습] 주의 : 1. functional 컴포넌트에서 함수를 호출하기 위해서는 useEffect( ) 안에 넣어야 한다. (axios, fetch) 2. axios, fetch를 사용한 후 사용하고자 하는 데이터를 추출. 추출 후 반드시 useState로 state값을 전달해야 한다. ----------------------------------------------------------------------------------------------------------------------------------- 주의: Link와 Route의 parameter는 상관관계에 있다. page1의 첫째 자식의 path는 "/" 이다. 이는 "홈"화면을 경로로 성정한 것이다. 즉, 부모인 Page1 컴포넌트가 보여.. 2020. 9. 23. react-router-dom Router: 네트워크에서 데이터의 전달을 촉진하는 중계 장치 Route: 길(경로/루트), 노선 Route에게 자식이 있을 경우 "/"는 기본적으로 "/부모"의 경로를 가지고 있다. Link를 사용할때 반드시 "/부모"를 같이 표시해줘야 한다. HTML5의 history API(pushState, replaceState and the popstate event)를 활용하여 UI를 업데이트 props : basename / forceRefresh / getUserConfirmation / keyLength URL의 hash를 활용한 라우터입니다. 정적인(static)페이지에 적합합니다. - 요청받은 pathname(경로)에 해당하는 컴포넌트를 렌더링합니다. 에서 전달한 pathname을 가 받는다. (r.. 2020. 9. 21. 이전 1 ··· 41 42 43 44 45 46 47 ··· 51 다음