FrontEnd
[JS] 문자열안에 문자열
str2의 길이가 3개라면 str1의 문자를 앞에서부터 3칸자르고 비교하고 한칸넘긴후에 또 3칸짜르고 비교하면 된다. abcdefg 와 abc를 비교한다면 abc vs abc bcd vs abc cde vs abc def vs abc efg vs abc 이렇게 비교하게 한 후, 만약 비교를 하다가 같은 문자열이 나오면 종료하면 된다. function solution(str1, str2) { var answer = 0; const len2 = str2.length let cnt = 2 for (let i=0 ; i
[JS] 외계행성의 나이
https://school.programmers.co.kr/learn/courses/30/lessons/120834 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 배열 'abcdefghij'를 만들어 준 후, 해당 인덱스값이 숫자인것을 활용하여 값을 바꾸어 주었다. function solution(age) { const alpha = 'abcdefghij' let answer = [ ...age.toString()].reduce((acc,cur)=> acc + alpha[Number(cur)] ,"") return answer; }
[JS] 자릿수 더하기
https://school.programmers.co.kr/learn/courses/30/lessons/120906 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 정수로 들어온 n => 문자열 => 배열 로 바꾼후 reduce를 통하여 값들을 다 더해주었다. function solution(n) { var answer = [...n.toString()].reduce((acc,cur) => acc + Number(cur),0) return answer; }
[JS] 순서쌍의 개수
https://school.programmers.co.kr/learn/courses/30/lessons/120836 1~n까지의 수가 차례대로 들어간 배열을 한 개 만든 후에 reduce를 활용해 순서쌍이 되는지 안되는지 판별하였다. function solution(n) { var answer = [...Array(n).fill().map((v,i) => i+1)].reduce((acc,cur) => n%cur ? acc : acc+1,0) return answer; }
[JS] 배열의 유사도
https://school.programmers.co.kr/learn/courses/30/lessons/120903 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr s1 , s2의 배열의 유사도를 체크하는 문제였다. reduce를 통해 같은 원수의 개수를 카운트해주고 filter를 통해서 같은게 있는지 없는지 판단하였다. function solution(s1, s2) { var answer = 0; answer = s1.reduce((acc,cur) => s2.filter((el) => el === cur).length ? acc +1 : acc ,0) r..
![[React] emotion styled 컴포넌트처럼 관리하기](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FobEWH%2FbtrRpZiGwZK%2F3paLQIsRYZIeOIXvbpLVV1%2Fimg.png)
[React] emotion styled 컴포넌트처럼 관리하기
리액트에서 emotion/styled 를 활용하여 작업하는법을 알아보자. 리액트에서 emotion을 통해 위와같은 박스를 만들어볼 것이다. 우선 emotion/styled를 적용하려면 해당 라이브러리를 설치해야 한다. npm i @emotion/styled 그리고 아래처럼 컴포넌트를 하나 만들어주자. 해당 컴포넌트 아랫단에, const GitHubLoginArea = styled` display: flex; align-content: center; position: absolute; right: 0; top: 5rem; padding: 1rem; background: #ffffff; box-shadow: 0px 1px 9px rgba(10, 31, 68, 0.1), 0px 0px 1px rgba(10, ..