본문 바로가기

분류 전체보기

(39)
step2. Modal + Form 오랜만에 하려니깐 흐름이 끊겨서 거의 다시 했다. 일단 class를 hooks로 바꿨고, github가 자꾸 오류나서 레파지토리도 새로 만들었다. 오늘은 Modal창과 Form을 위주로 만들었다. 1. 초기화면의 Add버튼을 누르면 항목을 입력할 수 있는 모달창이 화면에 나타난다. 2. 목표를 입력하고 3. 시작 날짜를 설정한다. 도전 종료일을 계산해서 알려준다. 4. 동기부여 메세지를 작성한다. 5. 그리고 제출한다. 만약 목표가 작성되 있지 않으면 안내 메세지가 뜬다. 6. 보드의 왼편에 입력한 내용과 현재상황을 보여주는 대시보드가 화면에 나타난다. 구현하기 어려웠던 것 😵😵 챌린지 수정하기 -> 아직도 못함 시작 날짜 설정 후 도전 종료일 계산 const getToday = () => { let t..
잡스 하늘나라에 계신 잡스 아저씨가 생전에 말씀하셨지 실천한지 9개월 정도 지났고 할당량을 채우기 까지 3개월+α 정도 남았다. 프로그래밍은 천재나 괴짜만 하는 줄 알았다. 근데 맞는 듯 🤣 프로그래밍 시작을 javascript로 시작했다면 포기했을 수도 있을거 같다 HTML이랑 CSS로 입문하면 해볼만 하겠구나 라고 생각했는데, 갈 수록 어렵구나😭😭 아니야😵 뭐든지 깊이 알수록 안어려운건 없지 결론은 잡스 아저씨 말에 동감 프로그래밍을 하다 보면 내 사고의 허점을 알 수 있다. 처음부턴 완벽할 순 없지만 허점을 채워가면서 프로그램은 완성되는 거 같다.
취업준비_면접 후기 & 복습 정말 기대도 안했는데 면접을 볼 수 있는 기회가 주어졌다. 기록 열심히 할려고 노트부터 폈는데, 긴장되다 보니 제대로 기록도 못해서 기억을 더듬어 면접 질문을 정리할려고 한다. 대답 못하는것도 꽤 있었고, 아는데도 막상 설명할려니 제대로 설명하지 못한 것도 많았다. 정말 이렇게 부딪혀 봐야 내가 모르는게 뭔지 알게 되는거 같다. 꼭 합격은 안되더라도 면접 기회가 많았으면 좋겠다... 그럴려면 내 실력부터 키워야겠지만 장마 시작이라더니 아침부터 비가 왔다. 미리 장소를 확인하고 근처에서 따뜻한 라떼를 마시면서 마음을 가다듬으려고 했는데, 카페인 버프로 더 긴장됐다 😨😨😨 면접 보기전에 체온 체크를 했다. 면접도 마스크를 쓰고 봤다. 처음에 간단하게 자기소개를 했다 언제부터 공부하기 시작했고, 왜 개발 공부..
step1. Main 오늘의 결과물 ✨ 1. create-react-app 설치 yarn create react-app 30days-challenge 2. styled-components react에서 컴포넌트에 CSS를 적용시키는 방법은 다양했다. 보통은 html, css, js 파일을 분리해서 작성하지만 react CSS-in-JS 관련 라이브러리인 styled-components를 사용해보고 싶어서 블로그랑 노마드 코더 유튜브 강의 보고 대충 사용법을 익혔다. 보고 따라하면 이해가 되는 듯 싶다가도 막상 직접 하려니깐 막막했다. 그래도 구글링 하고, 어제 본 코드 다시 보고 공식 문서도 보면서 하니깐 왜 쓰는지 정도는 조금 알거 같은..? 결국은 보여지는게 중요하니깐 css관리하는게 중요한데, 하나의 컴포넌트 파일안에 ..
intro_ 30days 어제의 습관이 오늘의 나를 만들었듯이 오늘의 습관이 10년 후 나를 만든다는 말이 있지... 그래서 만들어 보려고 하는 30days 챌린지! 일단 디자인 초안까지는 만들었는데 좀 더 디테일한 작업이 필요할 거 같다. ** 만들면서 추가, 필요한 기능 #1 + 버튼을 클릭해서 새로운 도전을 추가한다. #2 모달 창이 열리고 입력 폼이 나타난다. Close 버튼 추가 ** 입력 폼 내용 목표 시작하는 날 설정 + 자동으로 30일 후가 계산되어 끝나는 날이 설정 기본은 오늘 날짜가 설정되어 있다 → 오늘 날짜를 가져와서 value로 지정. ** 날짜를 설정하면 설정된 날짜를 가져와서 30일 후 날짜를 계산한 결과를 반환 ** 동기부여를 위한 나에게 보내는 메세지 작성 goal이 입력되지 않았을 때 → 목표를 ..
Level1_K번째 수 문제 설명 배열 array의 i번째 숫자부터 j번째 숫자까지 자르고 정렬했을 때, k번째에 있는 수를 구하려 합니다. 예를 들어 array가 [1, 5, 2, 6, 3, 7, 4], i = 2, j = 5, k = 3이라면 array의 2번째부터 5번째까지 자르면 [5, 2, 6, 3]입니다. 1에서 나온 배열을 정렬하면 [2, 3, 5, 6]입니다. 2에서 나온 배열의 3번째 숫자는 5입니다. 배열 array, [i, j, k]를 원소로 가진 2차원 배열 commands가 매개변수로 주어질 때, commands의 모든 원소에 대해 앞서 설명한 연산을 적용했을 때 나온 결과를 배열에 담아 return 하도록 solution 함수를 작성해주세요. 제한사항 array의 길이는 1 이상 100 이하입니다. a..
Level1_가운데 글자 가져오기 문제설명 단어 s의 가운데 글자를 반환하는 함수, solution을 만들어 보세요. 단어의 길이가 짝수라면 가운데 두글자를 반환하면 됩니다. 제한사항 s는 길이가 1 이상, 100이하인 스트링입니다. 입출력 예 풀이 글자수가 홀수일 경우와 짝수인 경우를 나눈다. if(length % 2 !== 0){ // 홀수일 경우 } else { // 짝수일 경우 } 2. 가운데 글자의 인덱스를 구한다. 글자수가 홀수일 경우 'abcde' 에서 가운데 글자는 3번째 글자인 'c'이지만 index는 2이다. length 5를 2로 나누면 2.5가 되고 내림을 해주면 2가 되면서 index랑 같아진다. 글자수가 짝수일 경우 'qwer' 에서 가운데 글자는 2번째와 3번째 글자인 'w','e' 이고, index는 1, 2..
Level1_완주하지 못한 선수 문제설명 수많은 마라톤 선수들이 마라톤에 참여하였습니다. 단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다. 마라톤에 참여한 선수들의 이름이 담긴 배열 participant와 완주한 선수들의 이름이 담긴 배열 completion이 주어질 때, 완주하지 못한 선수의 이름을 return 하도록 solution 함수를 작성해주세요. 제한사항 마라톤 경기에 참여한 선수의 수는 1명 이상 100,000명 이하입니다. completion의 길이는 participant의 길이보다 1 작습니다. 참가자의 이름은 1개 이상 20개 이하의 알파벳 소문자로 이루어져 있습니다. 참가자 중에는 동명이인이 있을 수 있습니다. 입출력 예 입출력 예 설명 예제 #1 : 'leo'는 참여자 명단에는 있지만, 완주자 명..
Level1_약수의 합 문제설명 정수 n을 입력받아 n의 약수를 모두 더한 값을 리턴하는 함수, solution을 완성해주세요. 제한사항 n은 0 이상 3000이하인 정수입니다. 입출력 예 입출력 예 설명 입출력 예 #112의 약수는 1, 2, 3, 4, 6, 12입니다. 이를 모두 더하면 28입니다. 입출력 예 #25의 약수는 1, 5입니다. 이를 모두 더하면 6입니다. 풀이 약수 : 어떤 수를 나누었을 때 나누어 떨어지는 수 → 나머지가 0인 수 n을 i로 나눌 때, i는 n보다 같거나 작아야한다. → 12를 나눌 때 i의 범위는 0 보다 크거나 12보다 작아야한다. push메소드로 배열 answer에 숫자n의 배열을 원소로 넣어준다. reduce메소드로 원소의 합을 구한다. function solution(n) { con..