본문 바로가기
300x250

개발 공부143

[알고리즘 문제풀이]로또의 최고 순위와 최저 순위 문제설명 로또 6/45(이하 '로또'로 표기)는 1부터 45까지의 숫자 중 6개를 찍어서 맞히는 대표적인 복권입니다. 아래는 로또의 순위를 정하는 방식입니다. 알아볼 수 없는 번호를 0으로 표기하기로 하고, 민우가 구매한 로또 번호 6개가 44, 1, 0, 0, 31 25라고 가정해보겠습니다. 당첨 번호 6개가 31, 10, 45, 1, 6, 19라면, 당첨 가능한 최고 순위와 최저 순위의 한 예는 아래와 같습니다. 순서와 상관없이, 구매한 로또에 당첨 번호와 일치하는 번호가 있으면 맞힌 걸로 인정됩니다. 알아볼 수 없는 두 개의 번호를 각각 10, 6이라고 가정하면 3등에 당첨될 수 있습니다. 3등을 만드는 다른 방법들도 존재합니다. 하지만, 2등 이상으로 만드는 것은 불가능합니다. 알아볼 수 없는 두.. 2021. 6. 15.
[알고리즘 문제풀이] 완주하지 못한 선수 with javascript 문제 설명 수많은 마라톤 선수들이 마라톤에 참여하였습니다. 단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다. 마라톤에 참여한 선수들의 이름이 담긴 배열 participant와 완주한 선수들의 이름이 담긴 배열 completion이 주어질 때, 완주하지 못한 선수의 이름을 return 하도록 solution 함수를 작성해주세요. 제한사항 마라톤 경기에 참여한 선수의 수는 1명 이상 100,000명 이하입니다. completion의 길이는 participant의 길이보다 1 작습니다. 참가자의 이름은 1개 이상 20개 이하의 알파벳 소문자로 이루어져 있습니다. 참가자 중에는 동명이인이 있을 수 있습니다. 입출력 예시 코드 작성 1. 정렬 후 같은 인덱스 위치에 없으면 리턴 function .. 2021. 6. 14.
코드스테이츠 10주차 리뷰 - 섹션2를 마치며 드디어 10주차가 되어 두번째 섹션을 마무리하는 ha시험까지 치뤘다. 결과를 먼저 말하자면 30기로 기수 이동 되었다. 기수이동이 된 날 저녁까지 왜 떨어졌을까 생각했다. 일단 HA시간에는 코플릿형과 과제형 두가지로 나뉘어 출제되었고, 코플릿은 3문제 중에 2문제의 조건 하나씩을 제외하고는 풀었다. 3번 그래프 문제에서 정말 포기하고 싶었는데, 예전 했던 코플릿을 돌아보며 어...이거 이용하면 근접은 하겠는데 하면 5시30분부터 제출전인 6시까지 온 힘을 다해 풀었더니 테스트통과 조건 4개 중에 3개까지 맞추게 되었다. 이때는 기분이 째졌다.ㅋㅋㅋ 과제형은 client와 server문제를 각각 react와 nodejs를 활용하여 푸는 문제였고, 모두 테스트 통과하였다. 쪼금 아쉬운건 테스트 통과는 되었지.. 2021. 6. 13.
[Extensions] VScode에서 다양하게 주석 사용하는 방법 extensions에서 Better Comments를 설치하여 사용할 경우 다양한 색깔의 주석을 사용할 수 있습니다. 코딩을 할때 좀더 직관적으로 읽을 수 있게 되는 장점이 있습니다. 2021. 6. 8.
[react, Css-in-JS]modal창 구현, styled 사용법, cursor, × 1. modal 창 구현하기 결과화면 (storybook 이용) 알게 된 것 1. styled-components 활용하기 -리액트의 한 컴포넌트 안에서 스타일을 적용시킬 수 있다. 깔끔하게 - styled-components을 사용하기 위해서는 맨 위에 import styled from 'styled-components'; 를 써준다. -기본적인 형태는 다음과 같다. 첫줄과 마지막 줄이 가장 기본의 형태이고, 적용할 속성은 다음과 같이 들어가면 된다. - 형태인 modalBtn의 변수에 스타일을 할당해준 것. export const ModalBtn = styled.button` background-color: #4000c7; text-decoration: none; border: none; paddin.. 2021. 6. 8.
[NodeJS] mini-node-server 구현 + express 변환하기 1 2 3 mini-node-server 구현하기 스프린트에서는 OPTIONS와 POST요청 두가지만 들어오고, /lower와 /upper 에 따라 다른 응답을 하는 문제였다. 1) preflight Request 예비 요청이 들어왔기에 options요청을 받고 응답해주어야한다. 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 39 40 41 42 43 44 45 46 47 48 const http = require('http'); const PORT = 5000; const ip = 'localhost'; const server = http.createServer(.. 2021. 6. 1.
[react] CSS-in-JS 관련 라이브러리 Styled Component Styled Component 정의 React 의 컴포넌트 기반 개발 환경에서 스타일링을 위한 CSS의 성능 향상을 위해 만들어졌다. styled Component 를 사용하면 기존 CSS 문법으로도 스타일 속성이 추가된 React 컴포넌트를 만들 수 있다. styled Component 1. Automatic critical CSS : 화면에 어떤 컴포넌트가 렌더링 되었는지 추적해서 해당하는 컴포넌트에 대한 스타일을 자동으로 삽입된다. 2. No class name bugs : 스스로 유니크한 className 을 생성한다. 이는 className 의 중복이나 오타로 인한 버그를 줄여준다. 3.Easier deletion of CSS : 모든 스타일 속성이 특정 컴포넌트와 연결되어 있기 때문에 만약 컴.. 2021. 6. 1.
[CSS] 구조적인 CSS 작성에 대한 발전 과정 Component-Driven Development(CDD) 부품 단위로 UI컴포넌트를 만들어 나가는 개발 프로젝트의 규모나 복잡도가 점점 커지고 함께 작업해야할 팀원 수도 많아짐에 따라 CSS를 작성하는데 일관된 패턴이 필요해졌다. 또 다양한 디바이스들과 디스플레이를 커버해야 하기 때문에 css는 더욱 복잡해졌다. 이러한 문제점을 해결하기 위해 CSS 전처리기(CSS Preprocessor)라는 개념이 나타났다. css를 작성할 때는 많은 반복적인 작업을 요구한다. color값을 찾는 일, tag를 닫는 일 등 뿐만 아니라 클래스의 상속과 같은 사항으로 css의 문서는 점점 양이 많아지고 유지관리에 많은 영향을 끼친다. CSS 전처리기 자체만으로는 웹서버가 인지하지 못하기 때문에 각 css전처리기에 맞.. 2021. 6. 1.
[JavaScript] 객체 메소드assign()와 배열메소드 findIndex() 개념정리 객체 메소드 findIndex()와 assign() 2가지 알아보기 findIndex() 1 2 3 4 5 6 7 const array1 = [5, 12, 8, 130, 44]; const isLargeNumber = (element) => element > 13; console.log(array1.findIndex(isLargeNumber)); // 3 이 나온다. Colored by Color Scripter cs findIndex라는 매소드는 주어진 판별 함수를 만족하는 배열의 첫 번째 요소에 대한 인덱스를 반환합니다. 만족하는 요소가 없으면 -1을 반환합니다. 1 2 3 4 5 6 7 const array = ["google", "naver", "kakao", "facebook", "coupang.. 2021. 6. 1.
반응형