리액트(2)
-
코딩애플 - 무작정 React 찍먹하기 -4- (글 상세페이지 UI만들기 or Component로 HTML 깔끔하게 줄이기)
이제 블로그 하단에 글 상세 페이지 형식으로 Modal창으로 띄우는 상세페이지를 만들어 보자!. 페이지가 넘어가거나 하는것도 있는데 그건 강의를 결제해서 봐야함.. 라우터를 설치하고 어쩌고 저쩌고 하던데.. 일단 그지니 무료강의만 기록하자;; Modal UI 디자인을 하자. js파일 line 39~43처럼 modal UI를 만들어주고, css파일 line 7~11과 같이 디자인을 만들자. 그런데 HTML을 만들때에 주의해야 할 것이. 지금 작성하는 곳이 return()의 안이라는 것을 명심하자. return( ) 이거 불가능.. 하고싶으면 세개의 div를 하나의 div로 또 감싸주는 방법 밖에 없다. 이걸 지키기 위해서 modal창을 위에 코드처럼 큰 div안에 만들었다. 그러면 이제 아래처럼 심플한 모..
2023.02.14 -
코딩애플 - 무작정 React 찍먹하기 -1- (리액트 설치와 셋팅법 2022+ 스타일)
무작정 React 문법을 알아보기 위해 유튜버 코딩애플의 영상을 보고 남기는 기록.. 우선 구글에 nodejs 검색 후 첫번째 뜨는 공식페이지의 가장 최신 버전을 다운로드 한다. 뭐 그냥 설치 되는곳에 아무대나 설치하면 된다. ㅇㅇ; 그 다음은 코드를 작성할 에디터 visual studio code를 설치한다. 마찬가지로 구글에 치면 다나온다. 이 후 다운받은 코드 에디터를 실행 시키자 위와 같은 에디터 창이 뜰것이다. 다음으로오오오 우선 작업 코드를 짤 폴더를 생성해 보자. 나는 동영상이라는 곳에 개발자라는 폴더를 만들었다. 그러면 다시 돌아가서 에디터에서 해당 폴더를 오픈해보자. 이제 앞서 만들어둔 폴더를 코드에디터로 열어보자. 좌측 위의 개발자 폴더가 열린걸 확인 할 수 있다. 이 후 아래쪽을 잡아..
2022.09.27