본문 바로가기

분류 전체보기84

백준 랜덤디펜스 💻😀 이번 방학에 학교 친구, 선배분들과 코딩테스트 스터디를 하기로 했다.목표문제풀이 습관을 잡기주 6회 문제를 풀이 후 블로그에 정리백준 랜덤 디펜스로 문제 풀이 랜덤 디펜스란?문제를 직접 고르지 않고 원하는 조건 내에서 무조건 랜덤으로 뽑아서 푸는 것.알고리즘 분류는 보지 않는 것을 규칙으로 한다.정해진 티어 내에서 푸는 방법과 특정 티어에서 시작하여 맞추면 티어+1, 틀리면 티어-1로 푸는 방법이 있다.나는 정해진 티어 내에서 풀고 문제 풀이가 수월해지면 티어를 올리는 방식으로 풀 예정이다. 랜덤 디펜스 방법solved.ac 접속 후 검색 창에 아래 조건 입력 후 alt+enters#1000.. *s4..s5 !@$mes#1000 : 푼 사람이 1000명 이상*s4..s5 : 티어 실버4~실버5 사이!@.. 2024. 12. 31.
[백준 2669번] 직사각형 네개의 합집합의 면적 구하기 - python, js https://www.acmicpc.net/problem/2669 💡문제 분석 요약평면에 네 개의 직사각형이 놓여 있는데 그 밑변은 모두 가로축에 평행하다. 이 네 개의 직사각형들은 서로 떨어져 있을 수도 있고, 겹쳐 있을 수도 있고, 하나가 다른 하나를 포함할 수도 있으며, 변이나 꼭짓점이 겹칠 수도 있다.이 직사각형들이 차지하는 면적을 구하는 프로그램을 작성하시오.입력입력은 네 줄이며, 각 줄은 직사각형의 위치를 나타내는 네 개의 정수로 주어진다. 첫 번째와 두 번째의 정수는 사각형의 왼쪽 아래 꼭짓점의 x좌표, y좌표이고 세 번째와 네 번째의 정수는 사각형의 오른쪽 위 꼭짓점의 x좌표, y좌표이다. 모든 x좌표와 y좌표는 1이상이고 100이하인 정수이다.출력첫 줄에 네개의 직사각형이 차지하는 면적.. 2024. 12. 30.
6개월 간의 프론트엔드 현장실습 인턴 회고 React도 제대로 쓸 줄 모르던 내가 사수가 없는 곳에서 6개월 간 인턴을 했다. 왜 인턴을 했는가?여러가지 이유가 있다.프론트엔드 실무 경험을 해보고 싶어서좋아하는 일로 돈을 벌고 싶어서내가 회사 생활에 적성이 맞는 사람인지 알고 싶어서3학년 2학기까지 수료하고 다리 수술을 해서+조금 쉬면서 진로를 찾고 싶어서 휴학 신청을 했다. 퇴원하고 걷는게 좀 괜찮아졌을 때는 알고리즘이랑 리액트 공부도 하고, 다리를 절면서 학원에서 아르바이트를 했는데 알바를 하는게 너무 재미가 없어서… 내가 좋아하는 일로 돈을 벌고 싶었다. 그리고 리액트를 공부하다 보니 더 깊게 실무 경험을 하고 싶은 마음이 들었다. 그래서 그 때부터 자소서도 쓰고 리액트, 자바스크립트 공부도 더 열심히 하며 인턴을 준비하기 시작했다. 사실 .. 2024. 12. 17.
AWS Amplify 배포 및 PR preview URL 생성하기 회사에서 AWS로 배포하며 팀원들에게 공유하려고 작성했던 글인데 조금 더 다듬어서 블로그에도 올려봅니다. Next.js로 배포를 하려면 어떻게 해야할까요?보통 vercel을 이용하여 배포하는게 일반적입니다. 그게 훨씬 쉽기도 하구요..그런데 vercel을 쓸 수 없는 경우가 있죠. 계정에서 무료로 배포할 수 있는 횟수를 다 채웠다던가, private organization에서 private repository를 배포하려면 매달 돈이 든다던가 ^^  보통 리액트 프로젝트를 AWS로 배포하면 S3에서 정적 페이지 배포, E2C에서 서버 배포, RDS에서 DB를 배포하는데요,저희는 Next.js에서 서버액션을 사용하기 때문에 S3를 이용해 정적으로 배포하면 안됐습니다.벌써 머리아프죠? 뭐가 뭔지도 헷갈리고 모.. 2024. 12. 14.
Github Readme.md 작성하기 README 파일은 GitHub과 같은 코드 저장소에서 프로젝트에 대한 설명과 정보를 알려주는 문서입니다.주로 프로젝트의 목적, 설치 방법, 사용 방법 등을 안내하여 다른 사람들이 프로젝트에 대해 쉽게 알 수 있도록 하죠~ Readme가 깔끔하게 잘 적혀있어야 이게 어떤 프로젝트인지, 뭘 개발했는지, 어떤 기술을 썼는지 잘 알 수 있겠죠?제 프로젝트도 아직 개발이 많이 진행되진 않았지만, 일단 Readme부터 써두고 점점 추가할 계획입니다 제 프로젝트는 아직 기획이 확정되지 않고 개발중이라 리드미에는 프로젝트 이름, 설명, 기간, 기술 스택, 실행 방법 정도만 넣었는데요, 기획이 확정되고 기능이 추가되면 프로젝트 구조, 기능 목록, 주요 기능 소개 등을 넣으면 좋을 것 같습니다. 1. Add a Read.. 2024. 12. 14.
Git으로 협업하기 회사에서 팀원들과 공유하기 위해 작성한 문서이다.  Git을 사용해서 코드를 관리하는 방법은 대체로 아래 순서를 따릅니다. 이슈 생성→브랜치 생성 및 브랜치 변경→작업→commit→push→PR→merge→pull 1. 이슈 생성하기Git Repository에서 Issues를 클릭하고 New issue를 클릭합니다 title과 description을 씁니다Assginees에는 보통 assign yourself를 클릭해서 자기 자신을 선택합니다본인이 맡은 이슈는 본인을 assgin하고 같이 하거나 다른 사람이 맡는 일은 다른 사람 assign 하면 됩니다.  Labels이나 Milestone은 저희 프로젝트에서는 따로 안썼는데 쓰고 싶으시면 도입하는 것도 좋을 것 같아요~  마크다운을 쓰시면 이렇게 편하게.. 2024. 12. 13.
react-router로 채팅방 라우팅하기 리액트는 프레임워크가 아닌 라이브러리이므로 내장 라우팅을 지원하지 않는다. 따라서 라우팅을 위해서는 a태그, window.location을 이용하거나, 라이브러리를 이용해야한다. 라이브러리를 사용하면 SPA환경에서 페이지 새로고침 없이 필요한 컴포넌트만 렌더링되고, 뒤로 가기/앞으로 가기 등이 더 자연스럽게 동작하기 때문에, 라이브러리를 사용해보기로 했다. Next에서는 Link 컴포넌트 혹은 useRouter 하나면 다 됐는데, 리액트에서는 react-router을 쓸 지 react-router-dom을 쓸 지도 정해야한다. 무슨 차이인가 싶어서 찾아본 결과..react-router-dom이 react-router의 확장된 버전이라고 한다.react-router라우팅을 위한 핵심(core) 로직만 포함.. 2024. 12. 10.
5일만에 SQLD 따기 불안했는데 붙었다. 간신히 턱걸이로… 취득 배경 및 당시 상황인턴을 하던 중 프론트엔드 개발자도 DB와 백엔드 공부가 필요하다는 것을 느꼈다. 프론트엔드에서는 DB를 다룰 일이 별로 없지만 그래도 DB 구조를 알아야 백엔드 개발자와 소통할 때 조금 더 편할 것 같아, 인턴 중 SQLD 취득을 목표로 공부했다!전공자긴 하지만 데이터베이스 수업은 들은 적 없고, 백엔드가 아니라 프론트엔드 위주로 공부해서 SQL이나 DB도 다뤄본 적이 거의 없었다. DB다뤄본 적은 있는데 ORM 써서 SQL은 안써봄.. 정보처리기사를 땄었는 데 이 때 정처기 공부한다고 DB 정규화 DDL DCL 이런 개념 공부한 게 배경지식의 전부이다.점수를 보면 1과목은 거의 다 맞췄고 2과목은 거의 턱걸이 수준으로 다 틀렸는데, 정보처리.. 2024. 12. 9.
채팅방 리스트 목록 구현하기 채팅방 디자인을 어떻게 하는게 좋을까?디스코드 같은 디자인으로, 왼쪽에 채팅방 리스트, 오른쪽에 채팅 리스트를 넣고 디스코드처럼 채팅방 리스트 최상단에 채팅방 추가 버튼을 넣는 게 좋을 것 같다. 채팅방 리스트 목록 디자인하기 shadcn/ui를 참고해서,왼쪽에는 저런 리스트 형태로 채팅방 리스트가 있고 오른쪽에는 채팅창 화면이 보이게 할 예정이다. 더미 데이터를 만들었다.const chatRooms = [ { id: 1, name: "일반 채팅방", participants: 15, lastMessage: "안녕하세요!", lastActivityTime: "방금 전", unreadCount: 3, lastSender: { n.. 2024. 12. 8.

티스토리툴바