커맨드 용어 cd 이동 mkdir 폴더만들기 ls -al 파일 보여주기 cat 파일의 내용을 화면에 출력 nano 파일만들기 q 나가기 j/k스크롤바 조작 git init 초기화 .git git repository git status working tree status 상태 git add . 버전으로 만들거니 staging area에 올려라 git commit -m "내용" 버전생성 git log show version 만들어진 버전 확인 git diff 최근 commit vs 현재파일 차이점 보여줌 git difftool 커밋아이디 현재파일 vs 특정커밋 비교가능 git branch 브랜치명 브랜치 생성해줌 git switch 브랜치명 브랜치로 이동 git merge 브랜치 합치기 메인브랜치로 이동해서..
return ( Blog 냥 {post[0]} {setPlus(plus + 1);}}> ♥ {plus} 7월 28일 발행 {post[1]} 7월 28일 발행 {post[2]} 7월 28일 발행 ); } jsx (확장문법) - class넣을땐 className사용 - 변수 넣을 때{ } 중괄호 사용 = 데이터바인딩 {서버에서 데이터를 가져와서 사이사이에 넣음} - style 넣을땐 style={ { 스타일명:'값' } } 괄호안엔 오브젝트,스타일명작성시 바사용 안됨 카멜케이스로 기입 state const [post, setPost] = useState([ "귀여운 고양이가 궁금해?", "귀여운 강아지", "귀여운 햄스터" ]); const [plus, setPlus] = useState(0); state ..
map map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열 반환 const numbers = [1, 2, 3, 4, 5]; const listItems = numbers.map((number) => {number} ); 엘리먼트를 반환하고 엘리먼트 배열의 결과를 listItems에 저장 왜 key를 넣어야 하는가? key는 react가 어떤 항목을 변경, 추가 또는 삭제할지 식별하는 것을 도움. 엘리먼트에 안정적인 고유성을 부여하기 위해 배열 내부의 엘리먼트에 지정해야함. 가장좋은방법! 리스트의 다른 항목들 사이에서 해당 항목을 고유하게 식별할 수 있는 문자열 사용 대부분의 경우 데이터ID를 KEY로 사용
터미널에 git이 설치되어있는지 확인 (맥은 자동설치, 윈도우는 설치필요) git 초기화와 로컬 저장소 git init: git 초기화 .git 이라는 숨겨진 폴더가 만들어짐 이게 로컬 저장소 한폴더에 하나의 로컬 저장소만 유지해야만 함 내 컴퓨터에서 폴더 생성 깃배쉬에 들어가서 만든 폴더 들어감 프로그램 만들기 cd 프로그래명 git init 깃 초기화 됨 ls 폴더에 있는 모든걸 보여줌 ls -al 숨겨진 폴더까지 보여줌 git add: commit 하나의 버전이라 생각하면 됨
import { useEffect, useState } from "react"; function App() { const [loading, setLoading] = useState(true); const [movies, setMovies] = useState([]); const getMovies = async () => { const json = await ( await fetch( `https://yts.mx/api/v2/list_movies.json?minimum_rating=8.8&sort_by=year` ) ).json(); setMovies(json.data.movies); setLoading(false); }; useEffect(() => { getMovies(); }, []); console..
coin tracker import { useEffect, useState } from "react"; function App() { const [loading, setLoading] = useState(true); const [coins, setCoins] = useState([]); useEffect(() => { fetch("https://api.coinpaprika.com/v1/tickers") .then((Response) => Response.json()) .then((json) => { setCoins(json); setLoading(false); }); }, []); return ( The Coins! {loading ? "" : `(${coins.length})`} {loading ? (..
박스모델 콘텐츠 및 크기 박스는 dispaly 값, 설정된 치수 및 박스 안에 있는 내용에 따라 다르게 동작함 콘텐츠는 부모콘텐츠의 크기 제어 가능 오버플로 콘텐츠가 박스에 비해 너무 큰 것 overflow속성을 사용하여 요소가 오버플로 콘텐츠를 처리하는 방법을 관리할 수 있음 Selector 선언은 선택자와 일치하는 요소에 스타일을 적용하는 속성 및 값 쌍이다 CSS규칙은 원하는 만큼 선언과 선택기 가질 수 있음! 단순 선택기 범용 Selector : 페이지의 모든 html요소에 적용 { color: pink; } 유형 Selector : 모든 섹션 요소에 적용 section { padding: 2em; } 클래스 Selector, ID Selector .my-class { color:red; } #m..