본문 바로가기

분류 전체보기267

#TIL #210906-0912 09월 06일 (월) 오늘 공부 한 것 js Q&A 영상 다시보기 TIL - js 포스트에 내용 추가 (Return, 객체 접근) console.log로 테스트 하고 나서, console.log 꼭 지우기 📗 아침 독서 15min "인클루시브 디자인 패턴" 수요일 까지 할 것 instagram - login 페이지, main 페이지 클론 기능대한 욕심 X 하나의 기능을 만들더라도 이해했는지? 확장성이 있는지? 코드가 깔끔한지에 중점! 09월 07일 (화) 오늘 공부 한 것 instagram 클론 : 한 줄 한 줄 리뷰한다 생각하고 작성하는 중 css - 최대한 flex로 잡기 확장성에 대한 고민 누군가에게 바톤터치를 하는 코드라고 하면 어떻게 작성하는게 좋을까? 무조건 "최소화"하여 작성하는 게 유지 보.. 2021. 9. 14.
[Algorithm 005] JS - twoSum Q. twoSum함수에 숫자배열과 '특정 수'를 인자로 넘기면, 두 값을 더해서 '특정 수(target)'가 나오는 index를 배열에 담아 return하기 nums: 숫자 배열 target: 두 수를 더해서 나올 수 있는 합계 return: 두 수의 index를 가진 숫자 배열 # target으로 보내는 합계의 조합은 배열 전체 중에 2개 밖에 없다고 가정 예) nums = [4, 9, 11, 14] target = 13 위의 값이 주어질 경우 nums[0] + nums[1] = 4 + 9 = 13 이므로 [0, 1]이 return 되어야 함 A. 우리 팀 답 const twoSum = (nums, target) => { const arr = [] for( i = 0 ; i < nums.length ;.. 2021. 9. 14.
[clone project]Danstagram - js (Main page) 첫 클론 프로젝트 Danstagram★ [메인 페이지 - 필수 구현사항] 댓글 작성 후 '엔터키'를 누르거나, '게시'를 클릭하면 댓글 추가 ✔️ 세 번째 버전 (Refactoring 후) - 소요시간 약 2.5h "use strict"; const postComment = document.getElementById('post'); const inputComment = document.getElementById('newComment'); const btnComment = document.getElementById('btnPost'); // 새 코멘트 값 체크 function checkComment(){ if(inputComment.value.length > 0){ addComment(inputCommen.. 2021. 9. 13.
[clone project]Danstagram - js (Login page) 첫 클론 프로젝트 Danstagram★ [로그인 페이지 - 필수 구현 사항] id, pw에 각각 한글자 이상 입력되어야 버튼이 활성화 되도록 하기. ✔️ 첫 번째 버전 ( Refactoring 전) - 소요시간 약 1h const isId = document.getElementById('user_id'); const isPw = document.getElementById('user_pw'); const letsLogin = document.getElementById('btn_login'); // id에 키업 때 한 글자 이상 있는지 체크 // pw에 키업 때 한 글자 이상 있는지 체크 // 두 다 글자 있는지 체크 // 둘 다 한 글자 이상 있으면 login버튼 active // 둘 중 하나 비었으면 있.. 2021. 9. 12.
[CSS]권장 작성법 Refactoring 세션에 배운 것 CSS part. css 유지보수가 javascript유지보수보다 힘듦 권장 속성순서 레이아웃에 영향을 많이 주는 순서 >>>> 적게 주는 순서 인접 속성끼리 묶어서 1. Layout Properties (position, float, clear, display) 2. Box Model Properties (width, height, margin, padding) 3. Visual Properties (color, background, border, box-shadow) 4. Typography Properties (font-size, font-family, text-align, text-transform) 5. Misc Properties (cursor, overf.. 2021. 9. 12.
[clone project]Danstagram - html, css 첫 클론 프로젝트 Danstagram★ 먼저 clone을 하기에 앞서 내가 이 프로젝트에서 무엇을 얻어갈 것인가에 대한 리스트 업을 했다. ✅ 우선 순위 html - 시멘틱 구성 : 왜? 그 위치, 그 태그를 사용했는지 고민하며 작성하기 css - flex속성 능숙하게 사용하기 css- float:left에 대한 의존도 줄이기 ☓☓ 우선 순위 아닌 것 (= 시선 뺐기지 말 것 제발..) 반응형 욕구 "똑.같.이"의 구현의 집착 (픽셀 크기 , 폰트 스타일 등) common - css @import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap'); *{ box-sizing:border-box; margin:0; padding:0; .. 2021. 9. 12.
[Linux] Terminal Command(터미널 명령어) Commands 명령어 뜻 설명 활용 / root 최상위 경로로 이동 ~ /home home디렉토리로 이동 cd change directory 폴더로 이동 cd .. cd ./dan cd ../dan ls list segments 현재 경로 내 파일 목록 출력 ls -al pwd print working directory 현재 위치를 경로로 출력 mkdir / rmdir make directory 디렉토리 생성 / 제거 rm remove 파일 / 디렉토리를 제거 rm으로 지운건 못살림 rm -rf 특히 rm -rf * 이렇게 하면 다 삭제되니까 하지말 것 cp copy 파일 / 디렉토리를 복사 mv move 파일 / 디렉토리를 이동 cat concatenate 터미널에 파일 내용 출력 touch touc.. 2021. 9. 11.
[Algorithm 004] JS - 주어진 문자열에서 문자의 인덱스 찾기 Q. 주어진 문자열에서 첫 번째 'a'의 index찾기 조건 1 : 만약 문자가 문자열에 존재하지 않는다면, -1 을 반환 조건 2 : indexOf 함수를 사용하지 말것 //주어진 문자열 const output = getFind('a', 'I am a hacker') A. 처음 제출한 답 function getFind(filter, sentence) { let arr = sentence.split(""); let result = sentence.includes('a') if ( result === true ){ return result } else { return -1 } } // true 먼저 split 메서드를 사용해 sentence값으로 들어오는 'I am a hacker'문자열을 쪼개어 배열로 .. 2021. 9. 11.