전체 글

그동안 잡생각이 너무 많았다. 한 번 정했으면 우직하게 나아가야 하는데 나는 뭐 이리 재는게 많을까.. 우유부단한 성격을 고치고 싶지만 그렇게 쉽진 않다. 내 안의 불안을 다스리는 방법을 배워야 겠다. 말로하면 뭘 못할까.. 당장 실행에 옮겨야 겠다. 매일 아침마다 일어나서 계획을 세우면서 내가 개발자의 길을 왜 택했는지 다시한번 상기하고 마음을 다 잡아야 겠다. 확실한 건 나는 무엇보다 코딩을 좋아한다. 성장을 저해하는 요소는 과감히 버리고 성장의 길을 도모하는 것이 현명하다고 생각한다. 시작된 3학년 2학기 과목 자체가 그렇게 어려운 건 없지만 또 쉬운 건 없다. 보통 한 번 들어서는 이해는 못하고 두 세번은 들어야 이해하는 것 같다 ㅋㅋㅋㅋ 이건 뭐 나만 그런건 아니니까 넘기고.. Next.js ,..

useReducer란 무엇일까? useReducer는 리액트에서 제공하는 상태관리를 위한 훅입니다. useState와는 다른 상태관리를 할 수 있다는 것이 장점인데요. 이 훅을 사용하면 컴포넌트의 상태 업데이트 로직을 컴포넌트에서 분리시킬 수 있는게 장점입니다. 다른 파일에 작성 후 불러와서 사용할 수도 있습니다. useReducer의 구성요소 const reducer = (state,action) => { } const initialState = { } function App(){ const [state,dispatchFn] = useReducer(reducer,initialState); //이하생략.. } useReducer는 reducer 함수와 초기값인 initialState를 인자로 받아야 합니..

미사일 피하기 게임에서 전투기 Sprite와 미사일 Sprite를 추가했다 한결 게임 다워졌다..ㅎㅎ 다음으로는 내 프로젝트의 하이라이트인 지능적인(?) 미사일을 구현해 볼 것이다. 많은 어려움이 있겠지만 많은 배움도 있을 것이다!

전투기가 지나가는 효과를 더 잘 주기 위해서 emission기능을 만들었다. 지난 번 포스팅에서는 어려운 부분이 있었는데 이번에는 특별한 어려움 없이 잘 진행했다.

1. 어.. 이거 어떻게 구현하지❓ 미사일 피하기 게임을 만들던 중이었다. 구름을 만들어서 Canvas를 이용하여 화면에 그리는 것은 쉽게 할 수 있었다. 아직은 이미지를 넣지 않고 빨간색 사각형으로 표현하였는데 저게 바로 전투기이다. 이제 이걸 움직여야 하는데 이 객체의 절대적인 위치를 바꾸는 방법은 사용하지 않았다. 그러면 너무 화면이 정적으로 보일 것 같았다. 만약 player는 그 자리에 있지만 회전을 하고 구름이 움직인다면 player는 제약없이 어디로든 무한히 움직이는 듯한 효과를 줄 수 있다. 하지만 이걸 대체 어떻게 구현하는 지가 문제였다. 2. 내가 생각했던 무식한 방법 일단 명확한 것은 Player는 회전을 해야 된다는 것이었고(1), 구름은 그 방향에 맞춰서 움직여야 된다는 것이었다(..

미사일 피하기 게임을 만들려고 한다. 개발하면서 여러 어려움들이 많을 것이다. 어려움을 해결하고 나면 해결방법을 블로그에 업로드 하려고 한다. 미사일 피하기는 내가 군대에 있을 때 서울대 컴공이었던 사람이 군대에서 잠깐의 시간동안 구현했었다. 나도 자바스크립트로 이 정도의 완성도 있는 게임을 만드는 게 목표였기 때문에 바로 도전하고자 한다. 인터넷으로 서치를 해보니 이미 구현된 게 있긴해서 참고하면서 만들면 좋을 것 같다. https://www.marketjs.com/item/evade-the-missile Evade The Missile - HTML5 Game For Licensing - MarketJS Preamble: This Agreement, signed on October 13, 2023 [h..

useReducer 우리는 react에서 useState로 상태관리를 할 수 있었고 이는 꽤 간단하다. 하지만 조금의 복잡한 상태를 다루어야 한다면 useReducer를 고려해보자 복잡한 상태의 경우 useState만을 사용하면 어려워지고 오류가 생길 수 있기 때문이다. 문제가 될만한 부분 다른 state를 기반으로 state를 업데이트 할 때 문제가 생길 수 있다. -> useReducer를 사용하는 것이 좋다. 하나의 state, 객체를 만들어서 보관할 수도 있지만 더 복잡해지기 때문에 잘 사용하지 않는다. 예시코드 const [state, dispatchFn] = useReducer(reducerFn, initialState, initFn); useReducer 사용해보기 const [entered..

정식으로 merge된 적은 없다 (앞으로 있을 것이다!) 하지만, contributor로 내 프로필이 올라가 있길래 어떤 기여를 하였는지 공유해보려고 한다. - react-icons 웹사이트에 검색 창 focus shorcut 을 구현했었다. 아쉽게도 merge될 기미가 보이지 않고, 다른 기여를 하고 싶어 close했다. tabler icon 업데이트를 반영하는 기여를 하게 되었다. 이 밖에도 아이콘 추가, Readme.md 업데이트 자동화.. 등을 할 예정이다. 그리고 나만의 아이콘 라이브러리를 만들어 홍보한 이후 react-icons에 포함되고 싶다.