토이프로젝트 17

[토이플젝] 사과 게임 - 마작 버전

https://natonato.itch.io/drag-10-mahjong DRAG 10 - mahjong match game by natonatoDrag the mahjong tiles to create the number 10!natonato.itch.io 사과게임은 1~9까지의 숫자를 가지고 10을 만드는 게임이고 마침 마작패에는 1~9까지 있는 수패가 3종류 있다 그럼 수패를 가지고 사과게임을 만들수 있지 않을까? 싶어져서 뚝딱 만들어봤다 하는김에 같은 종류의 수패만으로 10을 만들면 점수 2배 특별 룰도 추가했다 디자인과 네이밍은... 이게 개발자의 한계지 뭐

토이프로젝트 2025.04.23

[React] SweetAlert2 state 변경에 맞춰 업데이트(re-render)하기

팝업을 쓰다보면 이벤트의 반응이 팝업에 즉시 반영되도록 해야하는 경우가 있다 예를 들면, 위와 같이 필터를 클릭했을 때, 나머지 필터들을 흑백처리해 시각적으로 강조하고 싶을 수 있다 팝업을 직접 만들어 사용하면 별 문제 없겠지만, 난 귀찮아서 써본적있는 sweetalert2를 대충 적용했고, 여기서부터 문제가 발생했다. (그때는 spring에 jsp로 프론트를 뿌리고 있었으니까...) Filter를 저장하는 state는 상위 컴포넌트에 있고 Swal.fire로 html을 쏴주면 팝업이 정상적으로 뜨는데, 팝업 내부에서 클릭을 해도 팝업이 변하지 않는다. 그런데 팝업 뒤에서 페이지에는 필터가 적용되고 있었다. 이벤트는 정상적으로 발생했는데 Swal의 팝업만 업데이트가 되지 않는 것이다. 대충 알아본 원인은..

토이프로젝트 2023.03.17

라즈베리파이 4 VNC 초기 설정 및 VNC 원격 접속 설정하기

0. 시작 이유 전원이랑도 연결해야하고! 랜케이블이랑도 연결해야하고! 모니터! 키보드! 마우스!! 내가 전선에 파묻혀 죽겠다!! 해서 기존 모니터/키보드/마우스를 공유해 사용하려고 시도해 보았습니다 VNC로 윈도우 PC에서 원격 사용하기 KVM 스위치 구매해서 윈도우PC와 같이 물려놓고 스위칭 이렇게 2가지 방법을 생각해봤는데.. 돈 안드는 1번에서 잘 해결 되었습니다 + 전 편의상 모니터/키마 다 연결한채로 시작했습니다. GUI 최고! 터미널로도 같은 동작 가능합니다 1. vim 설치하기 기본적으론 vi만 깔려있고 vim이 없습니다 vi보단 vim이 여러모로 편하므로 깔아주면 좋습니다 sudo apt-get install vim 위 명령어를 통해 vim을 설치, 사용 가능합니다 2. 라즈베리파이 고정 ..

토이프로젝트 2022.01.15

라즈베리파이 4 더블 팬 알루미늄 케이스 조립

대충 이것저것 들어있는 중고 라즈베리파이를 구했습니다 빵판이나 GPIO 확장모듈은 일단 필요 없으니 케이스 조립부터 하겠습니다 케이스 구성품은 상판 / 하판 / 팬 모듈 / 나사 12개 / 써멀패드 3개 입니다 먼저 상단 판에 팬 두개를 조립했습니다(나사 8개 사용) 위쪽 핀으로 쉽게 연결될수 있도록 두 팬의 전선부를 가깝게 두었습니다 그 후 써멀패드 3장을 부착했습니다 부착 위치는 상판 뒷면에 튀어나와있는 부분 3곳입니다 상판을 맞춰서 조립해주고, 하판과 상판을 나사로 이어주면 케이스 조립은 끝납니다 대충 구동확인. 잘 돌아갑니다 5V에 연결했더니 팬 소음이 생각보다 심합니다 연장선을 추가해서 3.3V에 연결해볼 생각입니다

토이프로젝트 2022.01.07

[토이플젝] 그랑블루 판타지 친구찾기 - 근황 (12/26)

지금까지 진행된 사항들 (영상참고) (기존) ID와 메세지를 입력시 자동으로 Favorite 캐릭터와 소환수 정보를 크롤링, 이미지로 생성해준다 데스크탑 / 모바일 각 4종씩 8종류의 배경 제공 (추가 가능) 이미지 다운로드 가능 (웹 상 이미지는 크기 수정된 이미지, 다운로드는 원본) 이미지 + 정보 텍스트를 전용 트위터 계정에 공유 가능 (12.26 추가) Bootstrap 기반 frontend 페이지 작성 일정 시간(하루) 내 동일 ID 중복실행 방지 기존 이미지 반환, twitter 업로드도 1일 1회 제한 검색 기능 구현 트위터 고급 검색 결과 페이지로 redirect error 페이지 구현 세부 에러 처리는..... 앞으로 진행할? 사항들 프론트엔드 페이지 추가 작업 alert 창으로 결과 여..

토이프로젝트 2021.12.26

[토이플젝] 그랑블루 판타지 친구찾기 - 근황 (12/05)

지금까지 진행된 사항들 (영상참고) ID와 메세지를 입력시 자동으로 Favorite 캐릭터와 소환수 정보를 크롤링, 이미지로 생성해준다 데스크탑 / 모바일 각 4종씩 8종류의 배경 제공 (추가 가능) 이미지 다운로드 가능 (웹 상 이미지는 크기 수정된 이미지, 다운로드는 원본) 이미지 + 정보 텍스트를 전용 트위터 계정에 공유 가능 앞으로 진행할? 사항들 일정 시간 내 동일 ID 중복실행 방지 변경사항 반영하지 않고 기존 생성된 이미지 반환할 예정 Twitter 업로드도 불가능 일정 시간마다 작업한 이미지들 삭제하는것도 가능..한가? 프론트엔드 페이지 좀 꾸미기 하지만 결과는 처참했다! 검색기능 구현 1. 요구사항에 맞게 트위터 업로드 결과 필터링해서 보여주기 (최선) 2. 요구사항에 맞는 트위터 검색 ..

토이프로젝트 2021.12.05

[토이플젝] Thymeleaf에서 byte[] array 이미지 표시 및 다운로드 (ModelAndView)

사유 : static 폴더에 생성된 이미지는 서버 구동 이후에 자동으로 업데이트되지 않음 Spring devtools를 쓰면 된다고 하지만, intellij에서 추가적인 설정도 필요하고, init 단계가 반복 호출되면 망가져서 사용 불가 결국 File을 백엔드에서 프론트로 직접 전달(byte[]의 형태로) 1. File을 byte[]로 변경해 전송하기 (백엔드) @GetMapping("/getImage/{id}") public ModelAndView getImage(@PathVariable String id, ModelAndView mav){ try (InputStream inputStream = new FileInputStream("src/main/resources/static/image/"+id+"...

토이프로젝트 2021.12.03

[토이플젝] 그랑블루 판타지 친구찾기 - 근황 (12/02)

[이전글] 대충 취업준비 스터디 이런저런사정 등등으로 바빠서 한동안 작업하기도 힘들었고... 글로 정리하기도 힘들었습니다 일단 현재 시점까지 작업한 내용으론 1. Spring boot기반으로 변경 외부 lib 매번 파일로 넣고 설정해주기 귀찮다... Maven/Gradle 최고! properties 관리도 최고!! @Autowired랑 자동 싱글톤도 최고!!! 2. 이미지 생성 수정 이름, 랭크 등 출력 (ID 추가 예정) 소환석 정보 속성에 맞춰 배치 및 레벨/이름 출력 최대 3줄까지 메세지 입력받아 이미지에 출력 계정의 favorite 캐릭터를 받아와서 배경에 함께 출력 (기본 : 루리아) 3. 트위터 업로드 기능 구현 ID / 이름 / 소환석 정보를 포함 생성된 이미지 포함 자동 업로드 Twitte..

토이프로젝트 2021.12.02

[Unity] public string 줄바꿈 입력하기 (\n 작동 안될때)

문제상황 public class SignScript : MonoBehaviour { public string text; } 다음과 같이 public으로 변수를 선언하면 unity 엔진에서 해당 변수의 값을 오브젝트마다 넣어줄 수 있다. 이때 string의 경우 Enter는 입력되지 않고, \n과 같은 줄바꿈 문자를 삽입하더라도 줄바꿈이 일어나지 않는다. 이는 입력한 \n을 \\n으로 인식해 작성한 그대로 화면에 출력하기 때문이다. 해결방법 1. Replace함수 사용 public class SignScript : MonoBehaviour { public string text; // Start is called before the first frame update void Start() { text = t..

토이프로젝트 2021.11.09