U_D

1. AWS Amplify란? Amplify Console은 Git 기반 워크플로를 통해 풀 스택 서버리스 웹 애플리케이션을 배포 및 호스팅 할 수 있는 AWS 서비스입니다. 즉, Git repository와 연동시킨 뒤, Git에 소스코드를 Push하는 것만으로 프로젝트가 빌드되고 그 결과물을 호스팅까지 해주는 서비스입니다. 2. 자동 배포 설정 1) AWS Amplify console 접속 하여 웹 앱 호스팅 시작하기 2) GitHub 연결 선택 3) branch 선택 자동배포가 이루어질 브랜치를 선택한다. 여기서 하나를 선택하더라도 나중에 다른 브랜치를 추가 선택할 수 있다. 4) 빌드 스펙 설정 이 부분은 자동으로 빌드 설정이 진행되기 때문에 어려운 부분은 없다. 5) 자동 배포 이제 등록한 깃허..

프로젝트를 진행함에 있어 최대 3장까지 이미지 업로드가 가능한 다중 업로드 기능이 있었다. 그러다 보니 고화질의 이미지가 다수 올라가는 경우가 있었는데 이 때 이미지 업로드 속도가 느려지는게 느껴질 정도로 등록하기를 누른 후 유저가 느끼기에 꽤 오랜시간이라고 느껴질 만큼의 시간이 걸렸다. 그래서 유저가 업로드 한 이미지를 축소하는 방법을 검색하였고 라이브러리 중 browser-image-compression가 나와 선택하게 되었다. 1. 설치 yarn add browser-image-compression or npm install browser-image-compression --save 사이트 : https://www.npmjs.com/package/browser-image-compression bro..

1. 기간 일시 : 2022년 3월 25일 (금) ~ 2022년 3월 31일 (목) 2. 팀 과제 Q1. 컴포넌트 A는 리덕스 스토어를 구독하고 있습니다. 리덕스에 저장된 데이터가 변경되었을 때(A가 구독 중인 값이 변경되었다고 가정합니다.), 어떤 과정을 거쳐 컴포넌트 A가 변경된 값을 가져올 수 있는 지 흐름을 그려볼까요? [컴포넌트 A가 변경되는 흐름] 컴포넌트에서 Action이라는 객체를 실행할시 변경된 State 값을 dispatch 해준다. 이후 redux store 내의 action 함수에서 state를 reducer로 보내준다. reducer에서 state를 변경한후 return을 해준다. return된 값을 component가 받아서 변경된다. Q2. 옵셔널 체이닝이란 뭘까요? 어떤 경우..

일시 : 2022년 3월 11일 (금) ~ 2022년 3월 17일 (목) 시작 전부터 악명 높은 소문을 많이 들었던 터라 걱정이 많이 되었다. 걱정에 부응하듯 처음 마주한 알고리즘 문제는 그래서 뭐? 어쩌라고...? ㅋㅋㅋ 하지만 팀원분중에 그래도 알고리즘에 대한 경험이 있으신 분이 있어서 도움을 얻어가며 더듬 더듬 시작할 수 있었다. 4명에서 총 28개의 문제를 풀면서 각자 설명해 줄 문제를 정하는 형태였다. 처음에는 답을 찾아가며 이해하는게 대다수 였지만, 문제가 거듭될수록 for문에 대한 숙련도가 올라가는 느낌이었다. for문만 있으면 모든것이 가능할거 같은 기분이랄까..근본 for문 어쩌면 알고리즘 기간은 자바스크립트와 친해지는 기간이라고 생각된다. 그리고 꼭 필수적인 요소로 기억된다... 지금 ..

1. 문제 설명 현아는 항해에서 한 주 동안 몇 시간 동안 공부했는 지 기록할 수 있는 알고리즘을 만드는데 성공했다. 공부시간을 꼼꼼하게 관리하는 현아는 이번에 분 단위까지 계산할 수 있는 알고리즘을 만들기로 마음을 먹었다. 항해의 체크인 페이지에는 몇가지 조건이 있는데 이를 만족하는 알고리즘을 만들어보자. 체크아웃을 할 때 익일 시간은 24+a 로 계산한다. 즉 새벽 2시는 24+2 인 26으로 표기한다. 체크인 페이지는 새벽 5시까지 체크아웃이 되어 있지 않으면 체크아웃을 깜빡한 것으로 간주한다. 따라서 체크인 시스템은 새벽 5시 정각이나, 새벽 5시를 넘겨서 체크아웃을 하게 되면 자동으로 체크아웃을 오후 9시(21:00)로 한 것으로 처리한다. 2. 제한 조건 체크인(checkin)과 체크아웃(ch..

1. 문제 설명 CS 스터디 팀장이 된 지용이는 팀원들의 연락처를 수집하여 정리하는 도중 문제 하나를 발견했다. 지용이는 팀원들에게 전화번호를 ‘010-1234-4567’ 양식으로 제출하기를 부탁했지만 ‘01012345678’과 같이 ‘-’ 구분 없이 붙여서 제출한 사람들의 전화번호가 엑셀에서 앞에 0이 사라진 ‘1012345678’로 보이는 것이다. 지용이는 ‘1012345678’로 저장된 전화번호를 다시 ‘010-1234-5678’ 형식으로 바꾸려고 한다. 지용이를 도와줄 수 있는 알고리즘을 만들어 보자 2. 제한 조건 phone은 length는 10으로 고정됩니다. 3. 예시 입력/출력 4. 풀이 [slice 활용] 앞자리에 문자열 0을 더해주고 들어오는 문자열 번호에서 slice를 통해 0번째부터..

1. 문제 설명 1937년 Collatz란 사람에 의해 제기된 이 추측은, 주어진 수가 1이 될때까지 다음 작업을 반복하면, 모든 수를 1로 만들 수 있다는 추측입니다. 작업은 다음과 같습니다. 1-1. 입력된 수가 짝수라면 2로 나눕니다. 1-2. 입력된 수가 홀수라면 3을 곱하고 1을 더합니다. 2. 결과로 나온 수에 같은 작업을 1이 될 때까지 반복합니다. 예를 들어, 입력된 수가 6이라면 6→3→10→5→16→8→4→2→1 이 되어 총 8번 만에 1이 됩니다. 위 작업을 몇 번이나 반복해야하는지 반환하는 함수, solution을 완성해 주세요. 단, 작업을 500번을 반복해도 1이 되지 않는다면 –1을 반환해 주세요. 2. 제한 조건 입력된 수, num은 1 이상 8000000 미만인 정수입니다...

1. 문제 설명 임의의 양의 정수 n에 대해, n이 어떤 양의 정수 x의 제곱인지 아닌지 판단하려 합니다. n이 양의 정수 x의 제곱이라면 x+1의 제곱을 리턴하고, n이 양의 정수 x의 제곱이 아니라면 -1을 리턴하는 함수를 완성하세요. 2. 제한 조건 n은 1이상, 50000000000000 이하인 양의 정수입니다. 3. 예시 입력/출력 4. 풀이 [Math.sqrt / Math.pow 활용] 만약에 n의 제곱근을 1로 나눈 나머지가 0이라면 => 정수라면 n의 제곱근에 1을 더한 값의 제곱값을 저장 그게 아니라면 -1을 저장 //Math에 두가지 메쏘드가 있는걸 알고있어서 검색해서 풀기! function solution(n) { var answer = 0; if (Math.sqrt(n) % 1 ==..

1. 문제 설명 양의 정수 x가 하샤드 수이려면 x의 자릿수의 합으로 x가 나누어져야 합니다. 예를 들어 18의 자릿수 합은 1+8=9이고, 18은 9로 나누어 떨어지므로 18은 하샤드 수입니다. 자연수 x를 입력받아 x가 하샤드 수인지 아닌지 검사하는 함수, solution을 완성해주세요. 2. 제한 조건 x는 1 이상, 10000 이하인 정수입니다. 3. 예시 입력/출력 4. 풀이 [toString / split / reduce] x를 문자로 바꿔준다. toString ex. 10 -> '10' 배열로 바꿔준다. split("") ex '10' -> ['1','0'] reduce 메쏘드를 활용해 각 배열을 합산해 준다. 합산 할 때는 문자열로 반환하지 않게 초기값 0(숫자)으로 설정하고 더해지는 숫자..

1. 문제 설명 정수를 저장한 배열, arr 에서 가장 작은 수를 제거한 배열을 리턴하는 함수, solution을 완성해주세요. 단, 리턴하려는 배열이 빈 배열인 경우엔 배열에 -1을 채워 리턴하세요. 예를들어 arr이 [4,3,2,1]인 경우는 [4,3,2]를 리턴 하고, [10]면 [-1]을 리턴 합니다. 2. 제한 조건 arr은 길이 1 이상인 배열입니다. 인덱스 i, j에 대해 i ≠ j이면 arr[i] ≠ arr[j] 입니다. 3. 예시 입력/출력 4. 풀이 [splice / indexOf / Math.min / if..else] 배열의 길이가 1보다 크면 배열의 값 중 최소값이 존재하는 경우 배열에서 splice (a,b) 는 a번째 부터 b만큼 삭제 라는 의미 indexOf는 해당되는 값의 ..