mixin Scss에서는 믹스인이라는 문법이 있다. 반복적으로 재사용할 CSS 스타일을 하나의 함수처럼 지정해놓을 수 있다. 많은 mixin을 생성해도 호출하지 않으면 코드의 길이에 영향을 미치지 않는다는 점이 있다. 기본적으로 아래와 같이 정의할 수 있다. @mixin 믹스인이름(필요에 따라 변수지정도 가능){ 내용 } 호출은 include 키워드를 이용한다. @include 믹스인이름(지정했다면 변수사용 가능); 말줄임표 텍스트의 양이 공간보다 넘치는 경우 mixin으로 말줄임표('...')를 만들 수 있다. white-space는 자동 줄바꿈 여부에 관한 속성이다. nowrap으로 해제한다. overflow:hidden으로 넘치는 텍스트 양을 가리고 elipse로 대체한다. @mixin ellips..

들어가며 자바스크립트의 변수 선언 방법에는 var와 let, const가 있다는 사실은 자바스크립트를 조금 공부하기 시작하면 금방 알게되는 사실이다. 그리고 var 키워드를 지양해야한다는 것을 대략적으로 습득하게 된다. 조금 더 검색을 해봤다면 const 키워드는 재할당이 불가능하니 되도록 const 키워드를 지향하고, 재할당이 필요한 경우에만 let 키워드를 사용하는 것이 좋다는 사실까지 알 수 있다. 여기까지 좋다. 그렇다면 어떤 이유 때문일까? 내 머릿속을 정리하기 위해서 몇가지 개념과 함께 이를 알아보고자 한다. 그래서 var 키워드는 뭐가 문제일까? 변수 중복 선언이 가능 먼저 let과 const 키워드로 변수를 중복 선언할 경우에는 이미 선언되었다는 에러가 뜨지만, var 키워드로 선언한 변수..

깃허브 프로필 꾸며보기 요새 깃허브 리드미를 이용해서 프로필을 많이 꾸미는 것 같아서, 리드미에 조금 익숙해져볼겸 간단하게 꾸며보기로 했다. 깔끔한걸 좋아해서 많이 넣지는 않았지만 좀 더 지나면 종종 업데이트를 하지 않을까 싶다. 리드미에서는 마크다운과 html 태그를 모두 사용할 수 있다. 사전 준비 먼저 깃허브 아이디와 동일한 이름의 레포지토리를 생성해야 한다. 레포지토리 이름에 아이디를 입력하면 귀여운 고양이가 ✨스페셜✨ 레포지토리라며 깃허브 프로필로 쓸 수 있다고 말해준다. 캡쳐는 안됐지만 밑에 리드미 파일을 생성하는 것을 체크하면 바로 다음 단계로 넘어갈 수 있다. 꾸며보기 조회수 확인 조회수를 카운트해주는 사이트를 통해 추가할 수 있다. https://hits.seeyoufarm.com/ HI..

Grid Garden CSS의 레이아웃을 지정하는 속성 중 하나인 Grid에 대해서 공부하게 되었다. Flex에 비해 2차원으로 속성을 나열할 수 있다는 것이 매력적인 것 같다. 아직 제대로 쓰기엔 헷갈리는 부분이 많아 연습할 수 있는 사이트가 있지 않을까 해서 찾아보았다. https://cssgridgarden.com/#ko Grid Garden A game for learning CSS grid layout cssgridgarden.com 귀여운 그래픽의 사이트 발견~ 🤸‍♀️ 밭에 심겨진 당근에 물을 주거나 잡초를 없애는 스토리를 가지고 있다. 총 28단계! 예전에 Flex도 저 곳에서 연습했었는데 같은 시리즈 같다. (Flex는 연꽃 위의 개구리) Flex는 영어로 진행했었는데 친절하게도 한국어 ..

소스트리로 깃 원격 저장소에 push 하려다 에러가 발생했다. 내용을 대강 보니 작년에 만들었던 personal access token이 문제인 것 같다. 깃에서는 작년 여름쯤부터 보안상의 문제로 더이상 패스워드 기반의 인증을 지원하지 않고 있다. 이미 앞서서 위와 같은 모달창이 계속 떠서 파일을 몇개 삭제했는데 뜬 에러였다. 토큰 새로 생성하기 토큰을 다시 생성하기 위해 깃허브에서 설정 부분에 들어간다. 제일 하단의 Developer Settings 에 들어가면 Personal access tokens 로 갈 수 있다. Generate new token 버튼을 통해 새로운 토큰을 만들어야 한다. 적당한 이름을 만들어주고, 다른 블로그에서 보니 소스트리에 사용할 정도라면 repo만 체크해도 충분하다고 한..