git : 형상(버전) 관리 시스템 이라 요약 가능하다
git bash : 파워쉘(터미널)의 일종이다. ( 맥은 oh my zsh 다운 추천 )
git 과 github의 차이 : 버전 관리 소프트웨어(git) / 버전 관리 시 원격 저장소를 이용하는데 그 중 하나의 서비스 ( github )
touch (파일명) : 파일 생성
git add (파일명).(확장자명) : staging area 에 등록 ( git add . 을 입력시 . 은 현재 디렉토리를 의미하여 전체 등록됨 )
그리고 .. 은 현재의 상위 디렉토리를 의미
git status : git add 전 파일 상태 확인 시 사용 -> git add .
-> git commit -m(message 약자) "(메시지 내용)": 버전으로 추가 (버전을 남기는 느낌) -> git log로 내역 확인 가능
-> git push (원격저장소별명) (push할 브런치 이름)
/ git push -u origin main -> 다음부터 git push 입력 시 메인을 defalut로 push함
git log --graph -oneline : 터미널 메시지를 한 줄만 띄우기
a better git log : coderwall사이트에서 다운 -> git config --global alias.lg "log --color --graph --pretty=format:'%Cred%h%Creset -%C(yellow)%d%Creset %s %Cgreen(%cr) %C(bold blue)<%an>%Creset' --abbrev-commit" -> git 터미널에 붙여넣기시 git lg 타이핑시 출력UI 개선 가능
(END)가 보이면서 키가 안먹을시 q(quit 약자) 누르면 정상상태로 복귀
git log 입력시 commit 고유번호 일부를 복사하여 git checkout (붙여넣기) -> 복사한 버전으로 복구
git cechkout HEAD : 복구 전으로 복구 (가장 최신 버전)
git clone (저장소 주소) : 버전 정보를 포함한 모든 정보를 가져옴
git checkout (브런치이름) : 과거엔 브런치 옮기는 이유로 쓰이긴했지만 현재는 버전을 바꾸는용도가 적합
git switch (브런치이름) : 브런치 이동시 사용 권장
git switch -c(create 약자) (브런치이름) : 신규 브런치 생성하며 이동
git branch -d (브런치명) : 해당 브런치 삭제
git restore : checkout처럼 버전으로 돌아가지만 파일을 지명 가능 -> 연습이 좀 필요할듯..
팀프로젝트
영화별 리뷰가 나오도록 개선 / 메인페이지에서 받아오는 movieId활용
function postingComment() {
const nickname = document.querySelector("#nickname").value;
const pw = document.querySelector("#pw").value;
const rating = parseInt(document.querySelector("#rating").value);
const comment = document.querySelector("#comment").value;
const commentId = Date.now().toString();
if (isNaN(rating)) {
alert("평점은 숫자로 입력해주세요,");
return;
} else if (rating > 10 || rating < 0) {
alert("평점은 0점부터 10점까지 해주세요.");
return;
} else if (!nickname || !pw || !comment) {
alert("닉네임, 비밀번호, 평점, 댓글을 모두 입력해주세요.");
return;
} else {
const data = {
id: commentId,
nickname: nickname,
pw: pw,
rating: rating,
comment: comment,
};
const key = `comment_${movieId}_${commentId}`;
localStorage.setItem(key, JSON.stringify(data));
alert("댓글이 작성되었습니다.");
window.location.reload();
}
}
function loadComments() {
const allComments = [];
for (let i = 0; i < localStorage.length; i++) {
const key = localStorage.key(i);
if (key.startsWith("comment_" + movieId)) {
//가져오고
const commentAllDataString = localStorage.getItem(key);
//파싱 한 번 더 필요하니까
const commentAllDataArray = JSON.parse(commentAllDataString);
//그리고 그걸 넣기
allComments.push(commentAllDataArray);
}
}
return allComments;
}
function renderComment() {
const renderAllComment = loadComments(movieId);
const CommentSection = document.querySelector(".commentLi");
CommentSection.innerHTML = "";
renderAllComment.forEach((render) => {
CommentSection.innerHTML += `
<div class="userComment">
<p>닉네임: ${render.nickname}</p>
<p>${render.comment}</p>
<p>별점 : ${render.rating} / 10</p>
<button type="button" class="delBtn" onclick="DeleteComment(${render.id})">삭제</button>
</div>`;
});
}
renderComment();
function DeleteComment(THIS_IS_FAKE_KEY) {
const key = `comment_${movieId}_${THIS_IS_FAKE_KEY}`;
const commentRaw = localStorage.getItem(key);
const password = prompt("비밀번호를 입력해주세요.");
if (password === null) {
alert("비밀번호를 입력해주세요.");
return;
}
if (commentRaw === null) {
alert(`삭제할 댓글이 없습니다. (키값: ${key})`);
return;
}
const commentData = JSON.parse(commentRaw);
if (commentData.pw === password) {
localStorage.removeItem(key);
alert("삭제되었습니다.");
window.location.reload();
} else {
alert("비밀번호가 틀렸습니다.");
}
}
리뷰페이지 영화정보 받아오는 fetch 개선 -> Promise.all 이용하여 비동기 병렬 동작
const credits = movies.map(async (movie) => {
const creditsResponse = await (
await fetch(
options
)
).json();
return { ...movie, credits: creditsResponse };
});
//모든 비동기화를 병렬로 진행하여 속도향상 -> 하나라도 오류시 문제 발생하는게 단점
movies = await Promise.all(credits);