문미새 개발일지

무료로 사용하기 좋은 supabase를 퍼즐 프로젝트에 연결했다. supabase를 사용한 이유supabase는 어느 회사에서 면접 보는 중에 면접관님이 알려주셨다. 협업도 중요한데 개인의 기량을 위해 개인 프로젝트 하는 것도 괜찮을 것 같다며, 무료에다 sql기반으로 혼자서 풀스택처럼 할 수 있다고 사용을 추천해주셨다.supabase는 firebase의 대체제로 firebase와 다르게 PostgreSQL 기반의 서비스를 제공하기 때문에 데이터베이스나 파일 저장 등의 기능들이 가능하다고 한다. Supabase의 주요 기능PostgreSQL 데이터베이스강력한 SQL 데이터베이스(JSON, 관계형 데이터, 실시간 변경 감지 지원)를 제공하며, Firebase와 다르게 완전한 SQL을 지원한다.리얼타임 데이..

설치한 tailwind를 사용하여 스타일 구성을 변경하고, 기존의 게임 페이지는 /game 경로로 이동시켰다.프로젝트가 실행될 때 메인 페이지에는 닉네임, 퍼즐 개수, 퍼즐 선택 입력을 추가하고 게임 시작 버튼 클릭 시 /game 페이지로 이동하도록 구현했다.현재 퍼즐 이미지는 3개를 넣어놨는데, 화질과 가독성이 떨어지는 부분이 있어 나중에 깔끔한 퍼즐로 변경할 예정이다. 내용을 입력하고 게임시작을 누르면 alert창이 뜨며 확인 버튼을 누르면 game 페이지로 이동한다. 이동 시 입력한 닉네임을 확인할 수 있으며, 이동 횟수와 시간, 물음표가 보인다. const handleDrop = (event: React.DragEvent) => { event.preventDefault(); if (d..

그저께 정보처리기사 필기를 보고왔다. 이제는 아예 컴퓨터로 체크하고 답안 제출을 하다보니 시험지도 없어 문제 추출도 못 하는 것 같더라.다 풀고 점수 확인하니 72점 안정권으로 들어왔다. 합격자 발표는 3월 12일인가 했는데 아마 크게 변동은 없을거라 붙었다 생각하고 실기도 천천히 준비하려고 한다. 퍼즐const PUZZLE_ROWS = 5;const PUZZLE_COLS = 5;퍼즐의 열과 행 개수를 5개로 초기화했다. 처음엔 10개씩 해서 100개의 퍼즐로 해볼까했는데 이미지가 어려우면 못 풀겠더라. 그래서 무난하게 5x5로 했다.퍼즐에 사용할 이미지는 어디서 가져온지 모르는 흑정령 그림. 쓸만한 이미지를 찾던 중에 사진 폴더에 있길래 가져왔다. 지피티한테 물어본 결과 퍼즐을 만드는 방식은 css를 ..