404 page not found : 기록장

취업 후 첫 사이드 프로젝트로 LOACUT | 로생네컷 을 개발하는 첫 사이드 프로젝트를 진행하고 AWS에 배포까지 완료하였다. 처음 이 프로젝트를 기획했을 때 유저들이 포토샵 또는 이미지 에디터를 사용해서 인생네컷을 제작하는 걸 보았는데, 포토샵이나 이미지 에디터에 익숙한 사람이라면 괜찮을텐데, 대다수의 로스트아크를 플레이하는 유저들이 포토샵에 익숙하지 않거나, 이미지 에디터를 사용하려면 이미 잡혀있는 틀이 필요하고 또는 그 이미지 에디터 사이트에 가입을 해야하거나 금액을 지불해야 하는 경우가 있기 때문에 프로젝트의 키워드는 "포토샵 없이 간단하게" 였다. 모든 작업들은 프론트에서 처리하기 때문에 백앤드 서버가 필요가 없었고, react-cropper 와 dom-to-image 를 사용하여 개발작업을 ..

Generic은 타입을 불문하고 동작하는 것을 말한다. 즉, 함수에 인수를 넘길 때 타입 인수도 넘기기 때문에 타입에 관한 어떠한 정보도 잃지 않는다. any를 쓰는 것과는 다르다. any를 쓰게 되면 만약 number type을 넘기더라도 any type이 반환된다는 정보만 얻을 뿐이다. 하지만 generic을 사용하게 되면 number type을 넘기면 number type이 string type을 넘기면 string type 을 반환해준다. // 4. 모두(generic) function getGeneric(arg: MyType): MyType { return arg } const result41 = getGeneric(8); const result42 = getGeneric("안녕하세요"); co..

소심한 개발일기..오늘부터는 조금 더 꾸준히 써볼까 한다. 오늘 배운 부분은 결제시스템과 내 페이지에 연동시켜 결제화면을 구현하는 것을 연습했다. 결제하기 버튼 클릭을 했을 때, imp_uid를 전달받아온 후 imp_uid가 DB에 저장 후 결제 솔루션 업체 연결 API - 수수료발생 (PG사 결제모듈의 복잡함을 해결) 결제 대행 업체(PG사 - Payment Gateway)와 연결 해당 카드사 연결 후 결제 발생

엄청난 삽질을 많이했던, Pagination 작업을..마무리하며 일기 겸 구현한 페이지를 보기로 한다...ㅠ... 기초적으로 먼저 Pagination을 연습해보기 위해서, Container / Presenter로 나누어져 있는 컴포넌트가 아닌 원페이지에 먼저 작업을 해봤는데 너무너무 할만하고 쉬웠던 것이다! (물론 한페이지에 다 몰려있었으니 어려울리가...) 이제 자유게시판에 응용해서 집어넣어볼까! 라고 생각했는데.. 생각보다 어려운것이다.. 1. 리스트도 10개씩 계속 데이터가 refetch 될것, 2. 화살표를 누르면 10개씩 넘어갈것 (ex. 현재 1페이지에 있었다면 11페이지로 가야함..!) 3. 현재 1페이지에 있다면 이전버튼은 disabled 될것 4. 마지막 페이지는 10개씩 표출되는 것이 ..

리액트를 배우며, 웹 퍼블리셔때도 그렇듯, 항상 제일 싫어했던것이 폼이였다... 폼..폼ㅍ...폼...폼!!!!!! 회원가입도 제작도, 폼메일 만드는것도 너무너무 싫었지만 항상 하던 것이기 때문에, 개발자로 전향을 원하게 되면서 여기서도 벗어날 수 없는 폼을 만드는 작업을 열심히 배웠다.. 그.러.나 리액트에는 너무 좋은 라이브러리가 무궁무진하게 존재하고 있다! (그렇다고 라이브러리 없이 하는방법을 몰라야 한다는 뜻은 아니다. 기본적으로 어떻게 돌아가는지 이해는 있어야한다.) react-hook-form은 한국어를 지원하고 있기 때문에, 처음 접하는 국내 사용자들도 쉽게 이해할 수 있다.

API는 애플리케이션 소프트웨어를 구축하고 통합하기 위한 정의 및 프로토콜 세트로, 애플리케이션 프로그래밍 인터페이스(Application Programming Interface)를 나타냅니다. 그래서 REST API와 Graphql 의 차이점은 무엇일까요? 1. REST API REST API(RESTful API, 레스트풀 API)란 REST 아키텍처의 제약 조건을 준수하는 애플리케이션 프로그래밍 인터페이스를 뜻합니다. REST는 Representational State Transfer의 줄임말입니다. REST는 프로토콜이나 표준이 아닌 아키텍처 원칙 세트입니다. API 개발자는 REST를 다양한 방식으로 구현할 수 있습니다. RESTful API를 통해 요청이 수행될 때 RESTful API는 리소..

"" 상위의 link 태그 속성처럼 다른 폴더의 파일을 가져올 수 있는 방법이 있는데, 웹 퍼블리싱을 조금이라도 접해보았다면, @import는 한번 쯤 접해봤을 것이다. (필자는 구글폰트에서 웹폰트를 가져올 때 주로 사용했었다. 하위에 예시 참고) React에서도 다른 폴더에 있는 모듈이나, 파일을 불러올 수 있는데 그 때 사용하는 것이 "import"이다. 만약 경로를 지정하지 않는다면 어느 폴더에서 파일을 가져오는 것일까? 경로 지정을 하지 않았을 때에는 node_modules 모듈은 설치하게 되면 node_modules에 모듈의 파일이 저장되게 됩니다. node_modules에 설치된 모듈을 불러올 때에는, 경로를 지정할 필요 없이 모듈 이름만 작성하면 됩니다. 그렇기 때문에 우리는 리액트 모듈을 ..

웹 퍼블리셔로 일하면서, 이미 구축해놓은 프레임워크 내에 하드코딩으로 html / css/sass로 작업하던 필자는 git에 대한 지식이 zero였고, 부트캠프를 들어오면서 처음으로 "Git" 이라는 것을 접하게 되었다! 그래서, Git이 뭔데? Git is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency. 출처 - git website Git은 소규모 프로젝트에서 초대형 프로젝트에 이르기까지 모든 것을 빠르고 효율적으로 처리하도록 설계된 무료 오픈 소스 분산 버전 제어 시스템입니다. "소스..