미누에요

작년 여름방학에  LG AIMERS라는 아주 좋은 프로그램을 알게 되었고, 5기를 진행하며 내가 많이 부족하다는 걸 깨달았었다.그리고 그 후로 머신러닝/딥러닝 관련 스터디를 진행하며 내가 잘 알지 못하는 부분에 대한 학습을 진행하였고, 올해 초에 LG AIMERS 6기를 진행하게 되었다.   처음에 수강하는 강의의 내용은 5기와 완벽하게 동일해서, 빠르게 넘어갔다.그리고 시작된 온라인 해커톤....이번에는 elice가 아닌, dacon에서 진행되었다! 나는 처음에 엄청난 삽질을 했다.....코드에서 자꾸 train데이터에서 선택한 Feature가 test 데이터에 존재하지 않아 학습시킨 모델에 test 데이터를 넣지 못하고 있다는 것. 처음에 RandomForest 점수가 0.60, XGboost가 0...

이번에 해커톤을 진행하면서 "공유하기" 버튼을 눌렀을 때, 모바일에서 공유할 어플리케이션을 선택하는 부분이 뜨는 걸 구현하게 되었다.  아이폰 유저들은 위 사진을 많이 봤을 것이다.나는 웹 페이지에서 "공유하기" 와 같은 버튼을 누르면 위 공유 창을 띄워 공유할 곳을 선택하고 싶었다. 그러다 이 기능은 Web Share API를 사용하여 개발하게 된다는 것을 알게 되었다. Web Share APIMDN에서 만든 공유 api이다.텍스트, 링크, 파일 및 기타 콘텐츠를 운영체제의 공유 매커니즘을 활용해 공유할 수 있도록 하는  api Web Share API에서는 두 가지 메서드를 기본적으로 제공한다.navigator.canShare()navigator.share() navigator.canShare()해당..

우리는 링크를 카카오톡으로 공유하면 링크와 함께 미리보기 창이 뜨는 것을 많이 보았다.이렇게 공유할 때 정보를 함께 띄우려면, OG태그라는 기술을 사용해야 한다.  OG태그(Open Graph Tag)웹페이지가 소셜 미디어에서 공유될 때 어떻게 보일지를 정의하는 메타 데이터.소셜 미디어에서는 이 태그 정보를 참조하여 미리보기를 구성하게 된다.  OG 태그가 적용된 예시 페이지 이 페이지는 소셜 미디어에서 공유될 때 OG 태그를 활용하여 미리보기 정보를 제공합니다. OG태그는 주로 HTML 파일의 내부에 태그로 정의한다.  OG태그의 주요 구성 요소로는 아래와 같다.og:title - 페이지의 제목og:description - 페이지의 설명og:image - 대표 이미지의 URLog:url - 페이..

JavaScript의 ES6에서는 이전과는 많이 다른 형태의 함수 선언 방법이 제시되었다.그 방법은 바로 화살표 함수 방법이다.   화살표 함수(Arrow Function)화살표 함수 표현식을 사용하여 함수를 나타내는 방법은 아래와 같다.const 함수이름 = (인자)=>{ 함수 내용}; 딱 봐도 함수가 비교적 간단해 보이지 않는가 ? 보는 것처럼, 화살표 함수는 일반 함수에 비해 생략된 기능을 가진다. 화살표 함수는 this를 가지지 않는다.화살표 함수는 arguments를 가지지 않는다.화살표 함수는 생성자 함수로 사용할 수 없다. 화살표 함수는 this를 가지지 않는다. 기본적인 함수 선언에서 this는 동적으로 바인딩된다.객체의 메서드에서 this일반 함수 this생성자 함수에서 this객체..

나는 지금 동아리 홍보 차 간단한 테스트를 통한 이벤트성 웹앱을 만들고 있다.기능 상으로 구현이 마무리되었고, 3월에 있을 교내 동아리 박람회 이전에 태블릿 사이즈로 홍보를 진행하고자 반응형 작업이 필요하게 되었다. 디자이너 팀에게 768px 사이즈로 반응형 디자인을 요청드렸고, 반응형 디자인이 마무리된지는 꽤 지났지만 개인적인 일정으로 이제야 반응형 작업을 시작하게 되었다.  먼저, TailwindCSS에서 반응형 다자인은 아래와 같이 기본적으로 제공된다.   중단점      최소 넓이   CSS중단점최소 넓이CSSsm640px@media (min-width: 640px){ ... }md768px@media (min-width: 768px){ ... }lg1024px@media (min-width: 1..

나는 웹 프론트엔드 개발을 공부하며 현재 React를 메인 기술 스택으로 공부하고 있다.하지만 8월부터 얼떨결에 앱 개발을 하게되었는데............ 연구실 선배들이 하다가 놔두고 간 프로젝트를 가지고 기능을 추가하라는 교수님의 명령이었다............... Flutter, 강력한 개발툴이라는 것은 알고있었지만 한참 Google이 자사 프로젝트들을 많이 폐기처분하던 시점이었다.그래서 나도 Flutter를 공부하다가도 이게 사라져버리면 어떡하지? 라는 마음을 가지고 공부를 했던 거 같다.   우선 개발하게 된 플랫폼은 "Chrip-aid"로, 보육원 기부 플랫폼이다.자세한 설명은 뒤로하고, 마주했던 문제와 에러에 대해서 설명하겠다. 우선, 기능을 추가하면서 개발하며 "관리자 페이지"를 만들게..

지난 6개월동안, 연구실 선배들이 남겨두고 간 앱 프로젝트를 리팩토링하였다. Flutter는 이전에 개발해본 경험이 아예 없었던 터라, 처음에 굉장히 막막했던 기억이 있다.이 프로젝트는 거래의 투명성을 강조한 보육원 기부 플랫폼이다. 여름방학 때 교수님께서는 기존 코드를 먼저 분석해보라 하셨지만, 아는 게 있어야 머리에 들어오지. Flutter를 하기 전에 기본적으로 Dart 언어도 몰랐기 때문에 기본적인 학습이 필요했다. 심지어 이 프로젝트는 MVVM 디자인패턴으로 이루어져 있어, 디자인패턴 또한 학습을 해야했다. 프론트엔드 개발만 했었고, 그것도 React만 사용했었기에 디자인 패턴을 왜 사용해야하는지, 그리고 어떻게 사용하는 건지도 몰랐다.말 그대로 이 프로젝트는 개판이었다. 인수인계서도 없고, 해..

Flutter의 socket_io 를 사용하여 채팅 기능을 작업하던 중 ERROR [WsExceptionsHandler] Unexpected token o in JSON at position 1 이라는 에러가 발생하며 socket의 연결이 안되는 문제가 발생하였다. Flutter 프론트 측에서는 socekt.connect로 요청을 보내도, socket이 disconnect를 보내서 연결이 되지 않았다.서버 측의 로그를 확인해보니 아래와 같았다.   에러 로그를 보니 JSON으로 보낸 데이터의 형식이 맞지 않는다는 내용인 거 같았다.그래서 코드들의 내용을 보니, 이벤트에 해당하는 데이터를 같이 보낼 때, String 형식으로 보내지 않고 객체 형식으로 보내고 있다는 것을 깨댤았다. void sendMess..

이 문제는 숫자들을 받아 산술평균, 중앙값, 최빈값, 범위를 출력하는 구현 문제이다. 이 문제에서 발생할 수 있는 문제점으로는 -0이 출력되는 경우이다. 그 외에는 모두 수학 개념적인 부분을 구현하면 된다.  나는 이 문제에서 -0이 발생할 때 이를 해결하기 위해 fixNagativeZero라는 함수를 따로 구현하여 사용하였다.const fixNegativeZero = (num) => (Object.is(num, -0) ? 0 : num); 또한 최빈값을 찾는 문제에서, 배열의 각 요소들에 대해 Map을 사용하여 더 효율적으로 최빈값을 구하도록 하였다.// 최빈값const freqMap = new Map();let maxFreq = 0;let mostFrequent = [];for (let num of ..

이 문제는 두 수를 받아 그 사이의 수들 중 소수를 출력하는 문제이다.일반적인 소수 판별 기법을 사용한다면 메모리 제한 때문에 정답이 나오지 않는다. 따라서 우리는 에라토스테네스의 체(Sieve of Eratosthenes)를 사용해야 한다.  에라토스테네스의 체(Sieve of Eratosthenes)란?에라토스테네스의 체는 특정 범위 내에서 모든 소수를 빠르게 찾는 알고리즘이 방법은 배수를 제거하는 방식으로 소수를 판별하며, **O(N log log N)**의 시간 복잡도를 가진다.  1부터 N까지의 숫자를 담은 배열을 생성하고, 모든 숫자를 소수라고 가정예: N = 10 → [true, true, true, true, true, true, true, true, true, true, true]true..