분류 전체보기

[토이프로젝트] today-woozoo 제작기 (2/2) - 이미지 로딩처리, 번역모듈 부착

이 글은 나의 토이프로젝트 제작기를 정리하는 글이다. 왜 만들때 안하고 이제 하냐면 이런 스토리가 있다... 뭐냐면... [토이프로젝트] today-woozoo 제작기 (1) - 리덕스 툴킷 (Redux Toolkit) 이 글은 나의 토이프로젝트 제작기를 정리하는 글이다. 왜 만들때 안하고 이제 하냐면 이런 스토리가 있다... 처음에 CSR을 써보려고 시작했던 프로젝트였는데 만들고보니 굳이 CSR을 안써도 되는 1nnovator.tistory.com 여따 써놓았읍니다. 얼추 레이아웃을 잡고 NASA API를 연결해서 데이터를 불러와 이미지를 띄우는 것까진 했는데...걸리적거리는 문제가 있었다. 그리고 이미지를 화면에 표출할때 이미지 크기가 크면 천천히 화면에 표출되는 문제가 있었다. 이걸 해결하기 위해 ..

[토이프로젝트] today-woozoo 제작기 (1/2) - 사이트 개요, 리덕스 툴킷 (Redux Toolkit)

이 글은 나의 토이프로젝트 제작기를 정리하는 글이다. 왜 만들때 안하고 이제 하냐면 이런 스토리가 있다... 처음에 CSR을 써보려고 시작했던 프로젝트였는데 만들고보니 굳이 CSR을 안써도 되는 컨셉의 프로젝트였던 것이다. 그래서 SPA 기반의 웹으로 다시 전환하면서 정리해보려고 한다. *학습내용보단 제작기록을 주로 정리해두려고 한다. 사이트의 내용은 간단하다. - NASA의 APOD(Astronomy Picture Of the Day) OpenAPI를 사용하여 매일매일 새로운 우주(천문학) 사진을 보여준다. - 이전 일자들의 데이터들도 불러올 수 있다. - 우주 사진에 대한 번역된 설명을 제공한다. NASA OpenAPI React 18 (+ Typescript) RTK (Redux Toolkit) N..

정리노트: 클로져(Closure)랑 놀기

자바스크립트의 기본부터 천천히 공부하고 있다. 공부한 내용을 나만의 방식대로 정리해두어야 나중에 까먹어도 쉽게 다시 이해할 수 있을 것 같아 정리했다... 로 시작했지만, 사실 이번 글은 나 혼자 클로저를 이렇게 저렇게 따라해보며 이해해가는 글에 가깝다. 어떤 개념을 배울때 나에게 가장 중요한건 나의 언어로 정리하는게 가장 중요하다. 내가 클로져를 한 마디로 정의하자면 '생성시점을 기억하는 폐쇄공간'으로 정의 할 것 같다. 클로져를 공부하다보면 스코프(Scope), 스코프 체인(Scope Chain), 실행컨텍스트(Execution Context), 어휘적 환경(Lexical Environment) 등 부수적으로 공부해야할 말들이 굉장히 많이 나온다. 때문에 클로져에 대한 정리를 하려다가 부수적인 공부도..

정리노트: Javascript에서 this란 무엇일까?

자바스크립트의 기본부터 천천히 공부하고 있다. 공부한 내용을 나만의 방식대로 정리해두어야 나중에 까먹어도 쉽게 다시 이해할 수 있을 것 같아 정리했다. 해당 유튜브를 보고 따라하며 작성하였다. 핵심1. this는 '자신이 속한 객체를 가리키는 변수' 이다. 핵심2. this는 자신을 '호출'하는 방법에 따라 다른 값을 가리킨다. var someone = { name: 'KMS', someFunction: function() { console.log(this); } } 위와 같은 객체를 하나 만들어, 여러 케이스를 접해보며 this를 알아가보려한다. someone이라는 객체는 someFunction이라는 속성을 가지고 있으며, 이 속성엔 this를 콘솔에 찍는 함수가 담겨있다. // case 1 someo..

MAC에서 AWS EC2 인스턴스에 편하게 SSH 접속하기

맥 왜 사냐? 윈도우 사지 난 터미널 쓰려고 샀다 윈도우도 있는데 맥 왜 사냐? 윈도우 사지 인정합니다 맥은 기본 터미널이 참 잘 되어있다. 그래서 윈도우에서는 주로 putty 같은 프로그램을 통해서 AWS EC2 인스턴스에 접속했었는데 맥은 기본 터미널로도 편하게(거짓) 접속할 수 있다. EC2 기본 가이드에는 이런 식으로 설명이 되어있다. 저걸 매번 치고 들어가라니... 게다가 외울 수 없는 문자들로 이루어져있다. 그래서 이 글은 편하고 쉽게 접속하기 (= 한번만 귀찮기) 방법을 적어보도록 하겠다. 내가 까먹을 까봐... 우선, 준비물은 인스턴스를 시작할 때 사용했던 키 (pem 파일)이 필요하다. 해당 pem 키를 캡쳐처럼 ~/.ssh/에 위치하게 한다. (선택사항. 위치만 기억해두면 된다.) *아..