201027_TIL

Today I Learned

Sequelize (2)

어제에 이어 sequelize를 공부했다.

만들어져 있던 테이블과 관계가 있는 또 다른 테이블을 만들어 주려고 했는데,

여러가지로 시행착오를 많이 겪었다.

sequelize-cli를 이용했는데, migration:generate 파일에 추가할 컬럼과 제약조건을 넣어주고 넣어주다가 에러가 나면

다시 삭제해야하는데, migrate를 undo 했을 때 down 메소드에 무언가 걸어주지(?) 않았기 때문에 제대로 삭제가 잘 안됐다.

여러차례 겪고나서 어떤 방향으로 만들어야 할지 감이 왔는데, 이 감이 맞는지 모르겠다.

 

그렇게 해서 만들 foreign key

CSS - animation 효과

react로 이미지를 올리고, 정보를 수정하면 바로 반영되게 하는 앱을 만들어보고 있는데

이미지가 업로드 되는동안 뱅글뱅글 돌아가는 이미지 로더? 를 CSS의 애니메이션 효과로 구현해보았다.

로딩이 되는 동안 상황을 표시하는 state는 보통 gif로 구현한 것이 아닌가? 싶었는데...

,,,중략
	animation: spin 2s linear infinite;
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

이렇게 효과를 줘야하는 타켓에 animation 이름을 부여(spin)하고, spin이라는 애니메이션의 keyframes을 설정하는 것이다.

rotate말고도 여러 효과가 있는데, 이렇게 실습해볼 수 있어서 좋았다.

기회가 되면 여러 애니메이션 효과를 실습해보고 싶다.