HyungJin의 개발자 일기

카카오 겨울 인턴 코딩테스트에 나왔던 호텔 방 배정 문제입니다. 이 문제를 푸는 방식은 많지만 효율성 고려를 위해서 hashMap을 사용해서 풀면 좋습니다. hashMap으로 선언하여 key값은 손님이 들어가고자 하는 방의 번호, value의 값은 key방에 들어가려 할 때 실제 들어 갈 수 있는 방 번호를 의미합니다. public static long[] solution(long k, long[] room_number) { int roomNumberCount = room_number.length; long[] answer = new long[roomNumberCount]; Map hotelRoom = new HashMap(); for (int i = 0; i < roomNumberCount; i++) ..

해당 문제는 2019 겨울방학 카카오 코딩테스트 출제 문제이며 문제 이름은 '튜플'이다. 위 문제의 해결 방법은 문자열을 배열로 만들어 배열의 길에 따라 정렬 후 가장 짧은 것부터 반복문을 돌며 기존의 원소에 가지고 있는지 비교하여 없는 경우 추가 하는 방식으로 풀이를 하면 된다. 코드 해설 public static int[] solution(String s) { //문자열 처리 s = s.substring(2, s.length() - 2).replace("},{", "-"); String[] arr = s.split("-"); //길이에 따른 정렬 Arrays.sort(arr, new Comparator() { @Override public int compare(String o1, String o2) ..

요즘 대부분의 프론트 엔드는 React를 사용하고 React가 프론트 개발자에게는 필수라는 말이 있을 정도로 React의 중요도가 커진것 같다. 대학교 시절 외부 강사님의 강의에서 React관련 내용을 들어보고 매력적이다 라고 생각해 본적은 있었지만 이렇게 공부를 시작하게 될 줄은 몰랐다. 풀스택 개발자를 꿈꾸기 위해 이제 React공부를 시작해봐야겠다. 우선 React는 무엇이고 왜 필요한 것일까. 기존의 JS를 사용해서 모든 것을 만드는데 무슨 문제가 있어서 React, Vue, Angular등이 나오게 된 것인지 부터 알아봐야한다. 기존의 방식으로 방대한 프로젝트를 진행하고 개발을 하다보면 DOM을 관리하기 어렵다 라는 문제가 생길 수 있다. 그렇기에 DOM의 관리, 상태값 업데이트 관리의 최소화를..

오늘은 마지막으로 날씨와 위치를 API를 사용해서 가져와 화면에 나타내는 것을 구현해 보겠습니다. 날씨 정보는 https://openweathermap.org/의 API를 사용해서 가져와 화면에 표시할 예정입니다. 날씨 정보를 알기 위해서 현재 위치의 위도, 경도가 필요하니 해당 값을 가져오는 것을 보겠습니다. function handleGeoSucces(position) { const latitude = position.coords.latitude; const longitude = position.coords.longitude; const coordsObj = { latitude, longitude, }; saveCoords(coordsObj); getWeather(latitude, longitude)..

이번 시간에는 Back Groud Image에 대해서 처리하는 것을 해보겠다. 우선 현재까지의 파일 구조는 이렇게 되어있다. 여기서 images 폴더에 이미지를 5장 넣은 것인데 랜덤으로 이미지를 띄어주기 위해서 파일 이름을 1,2,3,4,5로 지정한 것이다. JS에서 랜덤 숫자를 가져오는 것은 단순하다. const number = Math.floor(Math.random() * 5); Math를 사용해서 위의 식처럼 가져온다면 0, 1, 2, 3, 4 중 1개의 숫자를 가져올 수 있다. 이는 다른 언어에서 사용되는 방식과 매우 유사하다. 이 작업은 간단하니 전체 코드를 보고 설명해보자. const body = document.querySelector("body"); const IMG_NUMBER = 5..

오늘의 목표 To Do List만들기 입니다. To Do List는 사용가 form을 이용해 값을 입력하면 해당 값을 Local Storage에 저장하고 이를 화면에 표시하고 X버튼을 눌러 각 To Do를 삭제 할 수 있는 구성으로 이루어져있습니다. 우선 HTML파일에 List를 저장할 수 있도록 form과 Ul을 이용해 입력을 받는 곳과 표시할 곳을 만들어 줍니다. 그 후 입력에 대해서 어떻게 처리할지 정해야합니다. 우리가 해야 할 것은 크게 3가지 입니다. 1. 기존에 저장된 값을 불러와준다. 2. 새로운 입력이 있는 경우 이를 저장하고 화면에 표시한다. 3. X버튼이 눌리는 경우 해당 To Do를 삭제하고 다시 저장한다. 여기서 할일목록은 배열로 관리를 하겠습니다. let toDos = []; 그다..

지난 시간에 이어서 오늘은 사용자가 이름을 입력하고 이를 저장하고 화면에 나타내 주는 부분에 대해서 진행하겠습니다. 오늘의 목표 화면은 다음과 같습니다. 사용자의 이름을 입력 받고 이를 저장해서 새로고침을 하더라도 계속 화면에 이름이 표시될 수 있도록 만드는 것이 목표입니다. 이를 위해서 HTMl코드상에 코드를 추가하겠습니다. 00:00 body태그 안에 form태그를 이용해서 입력값을 입력받도록 만들어주고 해당 기능을 구현하기 위해서 JS파일을 따로 만들어줍니다. 이는 각 기능 마다 JS파일을 따로 만들어 추후 관리가 편하게 하기 위함입니다. 그렇다면 greeting.js파일에서 어떠한 방식으로 동작을 해야 하는지 보겠습니다. 우리가 해야 할 것은 크게 3가지로 나뉩니다. 1. 입력값을 LocalSto..

JS로 Momentum만들기 첫 부분입니다. Momentum은 Chrome의 확장프로그램으로 첫 화면에서 사용자의 생산성을 높여주기 위한 페이지로 사용되는 앱입니다. 이와 비슷한 동작을 할 수 있는 앱을 JS를 사용해서 만들어 보겠습니다. 우선 화면에서 시계를 제공해 시간을 편리하게 볼 수 있도록 해줍니다. 위의 화면처럼 보여지는 것이 시계 만들기의 목표 화면 입니다. 이를 위해서 간단하게 HTML코드에서 00:00 body안에 div를 만들어 class를 지정하고 h1태그를 이용해 시계가 들어갈 부분을 만들어 줍니다. 그 후 const clockContainer = document.querySelector(".js-clock"); const clockTitle = clockContainer.queryS..