개발 연습 블로그

하루 요약 : 과아아아아제에에에에 특이사항 HTML에 조금씩 익숙해졌다. 정확히는 JSX지만....ChatGPT가 꽤나 괜찮은 임시 강사 노릇을 해줬다. 자잘한 이해를 돕는데 도움이 되었다. 과제에서 요구하는 사항은 state항목의 생성, 삭제, 수정이었는데 이 중 수정이 꽤나 날 애먹였다. state의 불변성을 지켜야하는데, 수정을 거치면 아예 다른 새 배열을 만들어 할당하던지 아니면 리랜더링을 강제시킬지 양자택일이었다. 처음엔 후자를 시도했지만 리랜더링 강제가 별로 좋지 못하다는 다수의 자료를 보고 전자로 방향을 틀었다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 const completeOrUndoToDo = (id) => ..

요약 : 알고리즘 마무리, 리액트 입문 정리 리액트 컴포넌트 구조 예시 버튼의 경우 1 2 3 function CustomButton(props){ return {props.children} } Colored by Color Scripter cs 자바스크립트의 함수형과 비슷하게 만들며 return으로 뭘 물려줄지를 결정한다. state 기본 구조 state는 컴포넌트 내부에서 변경할 수 있는 값을 말한다. UI 리랜더링을 위한 변수라고 생각하면 된다. 1 2 3 4 5 6 7 8 9 const [users, setUsers] = useState([ { id: 1, age: 30, name: '송중기' }, { id: 2, age: 24, name: '송강' }, { id: 3, age: 21, name:..

오전 : S.A과제 제출 특이사항 HTML은 정말 나하고 안 맞는 것 같다. 저번 풀스택 미니프로젝트 이후 다시 만나본 HTML과제는 하는 내내 가슴이 아파오고 짜증이 치밀었다. 아무래도 그때 쎄게 데인 것이 풀어지지 않고 가벼운 기피증으로 굳어진 것이 아닌가 싶다. 그래도 문제 자체는 팀원 조언을 한 두 번 받아가며 마무리했다. 사용법을 조금씩 익혀가지만 글쎄, 왠만해선 다시 볼 일이 없길 바란다. 리액트가 있으니깐 오후 : 리액트 인강 시청 쓸 거리가 너무나 많다. 뭐 부터 적어야 하지... \...\연산자 스프레드 연산자로, 자세한 것은 코드 예시를 보면 된다. 화살표 함수 이것도 코드 예시를 보자. 리액트에서 줄기차게 쓴다고 한다. yarn 명령어 --save 패키지.json의 의존하고 있는 패키..

오후 : 알고리즘 테스트 특이사항 문제가 3가지가 주어졌는데, 그 중 1, 2번 문제는 백준 문제를 단순화해서 가져온 문제였다. OX문제와 잔돈처리 문제였다. 나는 잔돈처리 문제를 for문을 돌리지 않고 깡으로 if문 뭉텅이를 박치기해서 클리어했다. OX문제는 문자열을 받은 값을 split으로 쪼갠 뒤 for문으로 하나하나 확인해서 값을 리턴했다. 다른 동기들은 그냥 문자열의 length를 받아와 했던데, 그것이 꽤 깔끔해보였다. 그리고 대망의 3번 문제. 지뢰찾기 문제. 이건 그냥 코드를 적어놓겠다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 function ..

오전, 오후, 저녁 - 알고리즘 문제 풀기 특이사항 이중배열 sort 그 거지같은 걸로 옛날부터 골치를 썩혀왔었는데, 오후에 운 좋게 다른 동기들 푸는 것을 귀동냥 한 덕분에 좀 더 쉽게 이해할 수 있을 것 같다. 1 2 3 4 5 6 7 8 9 10 11 const arr = [ ['b', 'a', 'c'], ['some', 'apple', 'car'], ]; const bear = []; for (let i = 0; i (a

오전 : 코어 자바스크립트 속독 시도 특이사항 며칠만 못 봐도 문제가 뭐가뭔지 구분이 안가는 수준이다. 완전히 머리속에 들어찰 때 까지는 책상 위에 놔둬야겠다. 오후 : 모의고사 특이사항 모의고사는 3문제 중 1문제를 택해서 진행되는 문제였다. 음.....문제 1번은 Date로 날짜 구하는 것, 2번은 for돌리는 것, 3번은 소수 구해서 뭐시기저시기 하는 것이었는데 나는 2번을 골라서 했다. 문제 내용은 항해 99에서 만들었으니 공개하기는 좀 그렇고 소스코드만 첨부한다. 1 2 3 4 5 6 7 8 function solution(arr1, arr2){ let answer=0; for(let i = 0 ; i = 29 ? 21 : arr2[i]) - arr1[i] return answer; } let ..

오전, 오후 : 문제풀이 특이사항 어제 만들어놓은 내장함수 모음집이 큰 일을 해줬다. 전부 담아놓은 것이 아니지만 그래도 상당히 많은 정보를 빠르게 재사용할 수 있었다. 유용하구만. 저녁 : 단체 코드리뷰 특이사항 팀원들과 단체로 코드리뷰를 했다. 이걸 진행하면서 느낀 것이, 다들 코드를 짜는 스타일이 확실히 차이가 난다는 것이다. 한 팀원은 일단 배열부터 만들고 한다던지, 다른 팀원은 한 줄로 줄이는 것을 선호한다던지. 나는 글쎄....말로 설명하기 쉬운 방법을 선호한다? 이렇게 말할 수 있겠다.

요약 : 자바스크립트 마무리, 프로그래머스 알고리즘 풀기 정리 자주 쓰이는 내장함수 목록 Math. abs(n) n의 절대값 반환 round(n) n의 소수점 반올림 floor(n) n의 소수점 올림 ceil(n) n의 소수점 버림 pow(x,y) x의 y제곱을 반환 .toString() 변수를 문자열로 반환 .toString(n) n진수 문자열로 반환 .slice(x, y) 배열의 x + 1번 부터 y 번까지 값을 복사한 새 배열을 반환 .splice(x, y) 배열의 x + 1 번부터 y개의 값을 제거하고 이를 값으로 가지는 새 배열을 반환 .split('asd', n) 문자열에서 'asd'에 해당하는 값을 기준으로 문자열을 잘라서 배열을 반환, ''으로 할 경우 띄워쓰기를 포함한 1글자씩 자른 배열..

오전, 오후, 저녁 : 문제풀이 특이사항 와아아아아아우. 아주 많은 문제다. 푼 문제들 코딩테스트 연습 - 직사각형 별찍기 | 프로그래머스 스쿨 (programmers.co.kr) 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 코딩테스트 연습 - 가운데 글자 가져오기 | 프로그래머스 스쿨 (programmers.co.kr) 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 코딩테스트 연습 - 두 정수 사이의 ..

오전 : 어제 배운 내용 복습 특이사항 비동기 작업의 동기적 표현이 가능한 방법으로 Promise가 있다. 프로미스는 제작 코드(원격에서 스크립트를 불러오는 따위의 시간이 걸리는 일)과 소비 코드(제작 코드의 결과물을 기다렸다가 값을 받아와 쓰는 함수)를 잇는 중간 단계의 코드라고 할 수 있다. 프로미스는 new 연산자로 호출한 프로미스의 인자로 넘어가는 콜백은 '즉시 실행'한다. 성공하면 resolve, 실패하면 reject, 둘 중 하나라도 실행되기 전까지는 then, catch로 넘어가지 못한다. 그러므로 비동기 작업이라도 강제로 대기시키기 때문에 동기적 표현이 가능해진다. 강의를 복습하면서 코드를 써보던 도중 undefined값은 false로 반환된다는 것을 알았다. 이건 꽤 중요할 것 같다. n..