노션 캠퍼스 리더로서 노션 행사에 초대를 받아 다녀오게 되었다 행사 이름은 Cafe Notion Seoul 이었고, 장소는 성수동 할아버지 공장(카페)이었다. 공장 컨셉의 크고 예쁜 카페였는데 노션에서 카페를 대관해 행사를 진행하였다 등록부터 세션, 네트워킹까지 총 5시간 정도 진행되었다 행사를 시작하기 앞서 다양한 굿즈를 나눠주셨다 사진에 보이는 명함은 커피 쿠폰이었는데, 카페를 대관한 만큼 6000원 음료 쿠폰을 모든 참가자들한테 나눠주셨다 컵홀더도 노션 로고가 적혀있어서 노션 행사에 온 것이 실감났다 그리고 정말 신기했던게 있다. 지금 데보션 영 이라는 개발 대외활동도 하고 있는데, 거기서 같이 스터디를 하고 있는 언니를 만났다! 이 언니는 캠퍼스 리더는 아니었고 일반인으로 행사에 참여했는데 서로 ..

로컬에서 작업하던 코드를 빗버킷 레포지토리에 올려보자.중간에 빗버킷 토큰(비밀번호)도 발급 해보자. Bitbucket이란? 쉽게 말해 Github 같은 코드 저장소이다. Atlassian에서 제공하는 Git 기반의 소스 코드 관리 플랫폼이며Atlassian의 협업툴인 지라(Jira), Confluence와 쉽게 통합되어 있어 많이 사용된다특히 비공개 레포지토리 지원이 Github, Gitlab 보다 많아서 보안이 중요한 기업에서 자주 사용된다. 오늘은 기존 로컬에서 작업하던 코드를 Bitbucket에 올려보자.   1. 우선 Create 를 눌러 레포지토리를 생성해준다. 나는 로컬에 있는 코드를 그대로 올릴거라서 이름은 기존 코드와 동일하게, 그리고 README와 .gitignore은 생성하지 않았다체크..

한 줄 설명vite로 배포중인 리액트 프로젝트 모바일로 localhost 접속해서 확인하기문제 상황웹앱을 개발하면서 모바일 환경에 맞춰 화면을 구성하다 보니, 계속해서 개발자 도구를 이용해 모바일 화면을 확인해야 했다. 이 과정이 상당히 번거로웠고, 특히 아이폰의 노치 때문에 실제 배포된 화면을 직접 핸드폰으로 확인하고 수정해야 했다. 그래서 개발 중인 localhost를 내 핸드폰에서 바로 확인할 수 있으면 좋겠다고 생각하게 되었다.  시도했던 첫번째 방법일단 검색해서 나온 첫번째 방법으로 시도했다기존에는 npm run dev로 했다면, 뒤에 --host를 붙인다(-가 두개다)npm run dev -- --host또는vite --host로 개발 서버 실행해준다그러나.. 트러블 슈팅근데 나는 안 됐다. ..

개발자라면 vim이지!커스터마이징의 끝판왕 vim을 쓰고 싶었다,이건 두번째이유이고주변에 개발 잘 하는 사람들이 다 vim을 써서 따라해보고 싶었던게 첫번째 이유였다실제로 10~20년차 개발자를 만나봤는데, 터미널에서 코드를 편집하면서”하하 저는 옛날 사람이라 vim 써요“ 라고 말하는게 너무 간지나보였다그러나 비주얼 스튜디오 코드의 확장성 때문에 번번이 실패했고, 나중에라도 다시 도전해보기 위해 시도해봤던 링크를 모아보려고 한다 시작하기https://velog.io/@banjjoknim/Vi-Vim-%ED%8E%B8%EC%A7%91%EA%B8%B0-%EC%82%AC%EC%9A%A9%EB%B2%95 Vi / Vim 편집기 사용법리눅스 환경에서 사용할 수 있는 Vi(Vim) 편집기의 기본적인 사용법에 대해..

코테 문제를 풀다 보면 인자에 대해 약수를 구해야 하는 경우가 자주 나온다그때마다 약수 구하는 함수를 새로 짰는데, 계속 반복해서 같은 코드를 관리하다 보니 너무 귀찮아져서 블로그에 기록해두고 필요할 때 마다 복사해서 사용하려고 한다 😊 일반적인 코드-1부터 n까지 나머지가 0인 값을 더하기const findDivisors = (n) => { var answer = [1]; //1은 모든 수의 약수니까 약수 배열을 1 포함해 만든다 for(let i = 2; i 사람의 사고 방식으로 작성된 코드이다하지만 1부터 n까지 모든 숫자를 검사하기 때문에 시간 복잡도가 O(n)이라 비효율적이다. 더 효율적인 코드- 1부터 √n까지만 검사하기const findDivisors = (n) => { ..

GDG 상사 ! GDG(Google Developer Gorup)에서 신입사원을 모집했다! 이게 무슨 행사냐면, 하루동안 관련 직무 인턴이 되어서 멘토와 함께 업무 프로세스를 수행하며 배우는 시간이었다. https://festa.io/events/5520 GDG상사 | Festa!Festa에서 당신이 찾는 이벤트를 만나보세요.festa.io[이런 이벤트를 준비했어요] A. GDG상사에서 주어진 과제 : As is -> To be 상사와 함께 팀을 이뤄 3가지 중 하나의 과제를 제미나이를 활용해 GDG상사를 발전시켜주세요 과제1. 지디지마켓 중고 거래 불가 물품을 판별해서 리스크를 줄이자! 과제2. 지디지마켓 중고 거래를 추천해서 전환율을 높이자! 과제3. 지디지마켓에서 알바 신규 비즈니스로 트래픽을 높이..

얼마 전, 학교 교사인 지인에게서 Chat GPT가 생활기록부 작성에 유용하다는 이야기를 들었다.반면, 컴퓨터에 익숙하지 않은 또 다른 교사 지인은(컴맹) 아직까지 생기부를 작성하는 데 많은 스트레스를 받고 있다고 했다. 그래서 이번 글에서는 생기부 작성에 어려움을 겪고 있는 지인을 도와 5초 만에 Chat GPT로 생기부를 작성하는 방법을 소개하려고 한다. 시작합니다! 1. chatGPT에 접속한다. 그리고 왼쪽 사이드바에서 GPT 탐색을 누른다  2. 그러면 다양한 GPT를 탐색할 수 있다 3. 여기서 검색창에 '생활기록부'를 검색한다 4. 아무거나 클릭하고 채팅 시작을 누른다어차피 생기부 지피티 다 거기서 거기다  5. 학생에 대한 키워드를 적는다. 그러면 생기부 형식에 맞게 답변을 해준다  끝!!..

문제상황 Next.js 환경에서 페이지를 구현하고 있었다모든 코드에서 문제 없는데, localhost에 접속하니 이런 build error가 떴다 You'r importing a compoenet that needs useState. It only works in a Client Component but none of its parents are marked with "use client", so they're Server Components by default.Learn more: https://nextjs.org/docs/getting-started/react-essentials 에러 메세지를 읽어보니 useState를 쓰려면 use client를 명시해야 한다고 한다  해결 방법 해결 방법은 간단하..

✏️ 한 줄 설명동아리 홈페이지를 React+Next.js+schadcn/ui 를 이용해 개발중인데, Card content에 넣은 이미지가 불러와지지 않는 문제를 next.js의 Image 태그로 해결한 이야기를 기록해본다   문제 상황Next.js + shadcn/ui 를 이용해서 개발중인데, card 컴포넌트 사용시 card contents에서 이미지가 안 불러와지는 오류가 발생했다 코드를 살펴보자 1.우선 이렇게 코드 맨 위에 이미지를 import 했다 2.그리고 카드 배열을 만들었다 3.마지막으로 Card 컴포넌트의 CardContent 부분에 img 태그로 scr={card}로 붙여넣었다 그럼 문제가 뭐였는지 자세히 살펴보자  트러블 슈팅문제는 이미지가 StaticImageData 타입이라 과..