위코드 썸네일형 리스트형 [TIL-151] 위코드 63일차 : AWS 배포 AWS 배포 더보기 ☁ ~ cd Desktop ☁ Desktop cd WantU ☁ WantU ssh -i 키 54.180.151.133 jeonseulgi@54.180.151.133: Permission denied (publickey). ☁ WantU ssh -i 키 ubuntu@54.180.151.133 Welcome to Ubuntu 18.04.6 LTS (GNU/Linux 5.4.0-1060-aws x86_64) * Documentation: https://help.ubuntu.com * Management: https://landscape.canonical.com * Support: https://ubuntu.com/advantage System information as of Sun Mar .. 더보기 [TIL-125] 위코드 25일차: 코드 카타 / git merge master, git rebase master 코드 카타 주어진 문자열 뒤집기 내 답안 const sameReverse = num => { // num을 문자열로 바꾸어 글자별로 잘라서 array에 저장한다 let array = String(num).split(""); // array를 뒤집는다 let reverse = array.reverse() // 하나의 문자열로 다시 붙여서 newNum에 저장한다 let newNum = reverse.join("") // 문자열이 된 num과 newNum을 비교한다 if(String(num) === newNum) { return true; } else { return false; } } git merge/rebase master 개념 로컬에서 branch를 만들어 작업하고 있다가, 원격의 master에 변경사.. 더보기 [TIL-123] 위코드 23일차: React Router & Sass ReactJS props 개념 properties라는 뜻으로, 함수형 컴포넌트에 객체를 인자로 전달해서 함수 안에서 변수처럼 사용할 수 있다. 응용 dal_nim 10분 전 byeol_nim hae_dal_byeol님 외... 팔로우 [문제상황] 유사한 구조의 두 profile 를 컴포넌트로 바꾸었다. 그런데 서로 다른 텍스트가 들어가거나 태그가 필요할 때 그런 점들을 구현하기 힘들다. 속성 : alt와 src 속성의 값을 상황에 따라 바꾸어야 한다. 어려운 점은 텍스트 형식에 props와 일반 텍스트를 결합해야 한다는 점이다. 태그의 content : 상황에 따라 user의 닉네임을 props로 받아서 담아야 한다. 태그 : 팔로우 버튼이 필요한 경우에만 포함되어야 한다. style을 위한 클래스 : .. 더보기 [TIL-120] 위코드 19일차: 위스타그램 Wrap-Up / Javascript 테스트 CSS bottom-up 개념 자식 태그에 속성을 먼저 부여하고 그에 따라 부모 태그의 속성이 결정되게 하는 방식이다. 예를 들어, 부모 태그에 고정된 크기를 주는 게 아니라, 그 안의 자식 요소들의 크기를 부여하여 부모 요소의 크기가 결정되게 한다. 그럼 내부의 자식 요소에 변동이 있을 때 부모 요소도 알아서 조절되기 때문에 변화에 유연하다는 장점이 있다. 하지만 무조건 bottom-up 방식을 쓰는 것은 아니다. 예를 들어, 부모 요소의 정해진 크기(영역)을 초과하도록 자식 요소가 추가될 경우 스크롤해서 확인할 수 있게 할 때가 있다. .boxComponent { height: 200px; padding: 10px; margin: 10px 0; overflow: scroll; background-co.. 더보기 [TIL-119] 위코드 18일차: 위스타그램 - 메인 페이지 CSS outline 개념 input 태그에 border 속성을 제거해도 기본값으로 focus 되었을 때(인풋을 클릭해서 입력 받을 수 있는 상태) 파란색으로 테두리가 생긴다. 이 테두리를 outline 속성으로 제어할 수 있다. focus된 input에 대한 선택자는 input:focus로 쓸 수 있다. input:focus { outline: none; } focus된 input의 outline을 없앤다. 선택자 > 개념 input 태그의 자식인 p 태그에 CSS를 적용하기 위해 선택할 때 input p라고 쓸 수도 있고 input > p라고 쓸 수도 있다. 이 차이는 >를 쓰면 직속 자식만 선택된다...? Javascript innerText & innerHTML 개념 어떤 태그의 내용에 접근할 때.. 더보기 [TIL-118] 위코드 17일차: 깃과 깃헙 Git & Github git init : 새 프로젝트 시작하기 개념 내가 새로운 프로젝트를 만들 때는 git init을 사용하여 깃을 시작한다. // 깃을 사용하여 변경 내용을 감지하기 시작함 git init // 코드를 올릴 깃헙 서버(remote)의 레포지토리 주소를 origin이라는 변수에 저장함 git remote add origin repository_url // 현재 디렉토리의 전체 파일을 staging 영역에 추가함 git add . // 지금까지의 변경사항을 깃으로 저장함(커밋) git commit -m "first commit" -----여기까지 local----- // 쌓인 커밋을 main 브랜치에 업로드함(푸시) git push origin main 작업할 디렉토리에 git init.. 더보기 [TIL-117] 위코드 16일차: 위스타그램 - 로그인 페이지 JS Javascript location.href = "이동할 페이지"; 개념 location 객체의 href 속성 값에 특정 페이지 주소를 입력하면, 입력한 페이지로 이동시켜준다. 사용법 function moveToMain(event) { event.preventDefault(); location.href = "main.html"; } btnLogin.addEventListener("click", moveToMain); cf) location.replace 더보기 [TIL-114] 위코드 13일차: enemyRain 게임 - 내려오는 유령 Javascript setInterval() 개념 setInterval() 함수는 특정 동작(함수)를 특정 시간마다 실행시켜준다. setInterval(함수, ms 단위 초) 형태로 사용한다. 예시 function createGhost() { const ghostDiv = document.createElement("div"); ghostDiv.className = "ghost"; ghostDiv.style.left = `${Math.floor(Math.random() * 756)}px`; document.querySelector("#bg").appendChild(ghostDiv); setInterval(moveGhost, 1000); } setInterval(createGhost, 5000); setIn.. 더보기 이전 1 2 3 다음