차곡차곡 개발노트 차곡차곡 개발노트

Today I Learned Sequelize (2) 어제에 이어 sequelize를 공부했다. 만들어져 있던 테이블과 관계가 있는 또 다른 테이블을 만들어 주려고 했는데, 여러가지로 시행착오를 많이 겪었다. sequelize-cli를 이용했는데, migration:generate 파일에 추가할 컬럼과 제약조건을 넣어주고 넣어주다가 에러가 나면 다시 삭제해야하는데, migrate를 undo 했을 때 down 메소드에 무언가 걸어주지(?) 않았기 때문에 제대로 삭제가 잘 안됐다. 여러차례 겪고나서 어떤 방향으로 만들어야 할지 감이 왔는데, 이 감이 맞는지 모르겠다. CSS - animation 효과 react로 이미지를 올리고, 정보를 수정하면 바로 반영되게 하는 앱을 만들어보고 있는데 이미지가 업로드 되..

Today I Learned ORM: Object-relational mapping 객체와 RDBMS의 데이터를 자동으로 연결해주기 때문에 객체지향적인 코드를 사용하는데 익숙한 사람에게 관계형 데이터를 다룰 때 객체에 대한 표현에 제약을 받지 않고 객체처럼 사용할 수 있기 때문에 직관적으로 다가갈 수 있게 한다. 잘 사용한다면 SQL 문장보다 CRUD를 더 효율적으로 작성할 수 있고, 유지보수에도 효과적이다. 아직까지는 SQL문을 사용해서 사용하는 것이 그리 불편하다고 여겨지지 않지만, 컨트롤러, 서비스를 거쳐 작업해야 하는 양이 점점 방대해지면 ORM에 대한 애틋함이 남 달라지지 않을까 싶다. Sequelize 다양한 ORM 프레임워크가 존재하는데, JPA(Java ORM 인터페이스 모음)를 구현하는 ..

ubuntu 18.04를 사용하고 있습니다. vs code는 1.50.1 버전을 사용하고 있습니다. 간혹 ubuntu를 사용하면 window와 mac환경의 범주에 들어가지 않아 곤란할 때가 있다. 이를테면 이모티콘 단축키..? 그리고 vs코드에서 다중커서를 선택할 때 alt(window의 경우)키나 command(mac의 경우)키를 누른 채 커서를 누르면 다중 클릭이 되어 편리하게 편집이 가능하다는데, 내 경우 해당사항이 없어 불편했다. (ubuntu 20.04를 사용하는 다른 동료의 경우, alt키로 다중선택이 잘 되더라...) 그럴 때는 아래처럼 vs 코드 환경설정을 달리해주면 된다. vs 코드의 Settings에 들어간다. 검색창에 multi까지 검색하고 Editor: Multi Cursor Mod..

Today I Learned bind bind 메소드를 직접 구현하는 문제를 만났다.갓MDN을 정독하며 다시 공부하였다.pollyfill 부분은 항상 '이걸 쓸 브라우저는 만나지 않을거야 아마~' 하며 스킵했는데오늘은 그냥 그 부분만 보았다. 뚫어져라.. 컴퓨터는 참 정직하다.아닌건 아니고, 맞는건 맞다. 아마 컴퓨터가 독립운동했으면 광복을 수년을 더 당겼을지도 모르겠다.어쨋든 나는 bind를 그 무슨.. 3-3-7 공부법이었던가.. 기억이 잘 나지 않지만(역설적이군)자주 복습해서 기억에 오래 남겨야겠다. 오늘 이해한거 아까우니까~ MySQL 이전까지 Java를 공부하며 oracle 11g나 12c 버전을 사용했었다. 많은 쿼리를 경험해보진 못했지만, 그래도 HR계정으로 각종 연습을 통해 재미를 붙였었다..

Today I Learned알고리즘처음 접했을 때보다는 겁이 덜 난다.문제 푸는 시간도 측정할 정도로 여유가 생겼고, 익숙한 문제도 생겨났다. 고 생각헀다. 키패드 숫자에 있는 문자들로 조합할 수 있는 모든 단어를 반환하는 문제였다.사실.. 그렇게 오래 걸릴 문제가 아니었는데.. 생각보다 오래 걸렸다..ㅠㅠ문제를 파악하는데 일단 어려울거 같다는 지레짐작을 했다. 처음에 배열로만 잘 지정해줬으면 그렇게 시간을 허비하진 않았을터인데..결국 예시로 나온 '2745' 의 108가지 경우의 수를 손으로 다 끄적여보고 나서야.. 파악했다..ㅜㅜ 원래 콘솔창에 변수부터 하나씩 확인하면서 했었는데..꼭 안하는 날 유독 이런 문제가 터지니 다시 한번 기초의 중요성을 깨달았다. 개인 포트폴리오 아주 기초적인 틀이긴 하지만..

Today I Learned React Router React처럼 SPA(Single Page Application)으로 이루어진 경우 페이지 내에서 한번 로딩되고 나면 사용자가 어떤 클릭을 해도 부분적으로 업데이트 된다. 해당하는 컴포넌트만 바꿔주면서 원하는 데이터를 동적으로 불러와 볼수 있게 해주는 것. 하지만 문제점도 있다. 해당 페이지를 북마크 하고 싶을 때? 뒤로가기, 앞으로가기(히스토리) 하고 싶다면? 이런 문제를 보완하기 위해 SPA로 이루어진 리액트에서 네비게이터 기능도 가능하게 하는 것이 React Router 그럼 라우터는 무엇인가 웹에서 통상적으로 말하는 라우팅이란? HTTP에서 사용자가 요청하는 url 요청에 어떤 특정한 웹페이지로 연결해줄 것인지를 결정해주는 메커니즘 즉, 사용자의..

처음 우분투를 설치하고 iBus로 한글을 설치했었는데, Zoom 화상회의 채팅창에 한글 문제가 있어서(입력안되거나, 한글은 enter 인식이 안되는 등) fcitx 를 설치하여 이용했었다. 그러다 갑자기 별안간 정말 아무런 일도 하지 않았는데 아래처럼 한글만 입력했다하면 힌트창이 계속 나왔다. 구글링을 통해서 입력기 설정의 내부 환경설정을 모두 힌트 보이지 않게 해두었는데도 해결이 되지 않았다. 내부 설정 외에 패키지 지우고 다시 설치, 패키지 업그레이드 업데이트, 재부팅만 수차례.. 그러다가 우분투 복구모드로 파일시스템, 패키지, grub 까지 전부 진행하고 부팅해보아도 계속 입력기 힌트창은 사라지지 않았다. 사실 우분투를 다시 재설치 하려고도 생각해보았는데, 지금까지 거의 세달정도를 사용하면서 많은 ..

✿ React는 component로 이루어져 있다. ❀ component는 데이터를 가지고 있는 state, 사용자에게 어떻게 보일지 정하는 render() 로 이루어져 있다. ✿ React는 Re-render the whole app on every update - 즉 데이터가 조금이라도 업데이트 되면 전체적으로 애플리케이션 리랜더가 이루어 진다. ✿ component는 class 혹은 function으로 구현할 수 있다. ❀ class로 구현하는 방법은 React.Component 그리고 React.PureComponent ❀ function으로 만들 수 있는 방법은 function, memo(function) 그리고 React Hook ✿ 클래스 컴포넌트와 같이 state와 lifecycle met..