Nomad Coder

코딩을 도와주는 editor 가 필요하다. Atom 이나 Bracket 도 있지만 나는 VSC 를 사용하기로 했다.그리고 설치하면 다양한 부가 extention 을 설치할 수 있는데 그 중에서 "prettier" 를 설치하면 입력하는 코드를 보다 더 예쁘게 보여지고 (

다음주 부터 진행할 노마드 코더 챌린지를 위해서 미리 강의를 예습해 보고 있다. 하지만 돌아서면 잊어버리기 때문에 이렇게 블로그에 Today I learn 이력을 남겨놓는 것은 공부하는 입장에서 좋은 습관인 것 같다. 다만 아직 Velog 사용법이 익숙하지 않은데 뭐든

css는 selector part 와 property part로 나누어져 있다.selector part : 생각하는 모든? 대부분의 태그 이름이 해당되며 여기에는 ID, class ( : 태그, 링크, 문단, 헤더, 푸터, div 등등property part : 소문자

만약 내가 많은 수의 박스를 가지고 싶은 경우에, float 나 inline-block 을 여기저기 바르는 방식은 박스가 옆으로 떨어지는게 아니라 밑으로 내려간다.이 경우에 자세히 보면 좌우 마진이 다르다. 그래서 일일이 7.2 px, 7.8 px 이렇게 마진값을 수정

아래와 같은 input element 를 예로 들어보자.1\. 나는 저 submit 버튼을 빨간색으로 바꾸고 싶다. \- 그러면 클래스 선택자를 이용해서 바꾸는 것이 일반적 이다. \- .submit { background - color : red ; } 이렇게

동영상을 보면서 강의한 내용을 메모를 하며 듣고 난 후 공부한 내용을 떠올리면서 블로그를 적는 것은 정말 도움이 된다. 갑자기 다른 이야기지만 세상 모든 일이 다 그렇듯이 잘하면 재밌고 반대일 때는 재미가 없다. 어떻게 해보니까 재미를 느낀다 라는 것을 맛보니 공부를

" " (따옴표), ' ' (싱글따옴표): 주의사항 - 따옴표를 쓰면 끝에도 따옴표를 쓴다. 따옴표와 싱글 따옴표를 섞어서 쓰지 말라는거. 이러면 아까처럼 콤마가 너무 많아 문자열 많이 썼을 때 지저분 해 보인다.\`\` 백틱을 사용 : 새로운 스트링 방식. (키보드

이미 존재하는 함수를 배워보기css 와 같이 자바스크립트에서도 element 를 선택할 수 있다.: css 에서는 선택자를 통해 style.css 에 html element를 선택했었다.HTML 에 바꾸고자 하는 태그에 id 를 준다. 방법은,: console 대신 d

저번의 그 코드를 불러왔다.title.innerHTML = "Hi From JS!": 이걸 통해서 HTML을 이 DOM 객체로 바꿀 수 있다.자 이제 title 에서 가진 가능성을 모두 보여 보자.console.dir(title); 의 목적: title의 모든 obje

transitiontransformationanimationmedia query이동, 변경을 멋지게 보여주는 효과위의 코드대로 라면 텍스트 배경색이 그린색이고 마우스를 가져다 댔을 때, 배경색이 빨간색으로 바뀔 것이다. 그러나!이렇게 그린에서 빨강으로 변경할 때 변화되

좀아까 트랜지션이 변화되는 과정을 담는 애니매이션 효과이고 hover나 active 같은 아이들과 함께 쓰인다고 했다. 그럼 트랜스폼은? 범블비html 문서의 element 들을 변경하여 모습이 변하는 효과를 뜻한다.모습, 직접적으로 모양이 변화하는! 모양이!모양모양모

앞서 계속 rotate, scale 반복하고 싶다!!!!!!!!!!: 지금껏 배운 트랜지션, 트랜스폼을 삭 지워봐봐이제는 애니메이션을 생성해 볼 차례: 일단 애니메이션 이름을 짓자. 키프레임이 있다고 하자.@keyframes 옆에는 내가 적용할 애니메이션의 이름을 짓자

왜? 큰 스크린을 위한 css 가 있고 작은 화면을 위한 css 가 있기 떄문이다.: 작은화면>>>아이폰 같은 모바일 환경, 큰 화면>>> 데스크탑 환경유저가 모바일 환경이라면, 원래 body 색을 초록이라 하면우리가 보는 화면이 최소값 320, 최대값 640일 때 배

이벤트를 발생시키기 위해, 이벤트에 반응하기 위해서 만들어짐.단순히 HTML 이나 CSS 만을 바꾸기 위해 있는 것이 아니다.clickresizesubmitinputchangeload아마 더 있겠지?addEventListener: 우리가 여기서는 창에 (window)

많은 것들이 조건이다. 조건이란 (), 괄호안에 어떤 것이 뭐든 참을 의미하면 무엇이든 넣을 수 있다.괄호 안의 10 > 5 가 true 이면 로그창에 true 가 입력될 것이고 거짓이면 else 블록을 실행시키게 된다.10===5: 3equals, 5에 10을 할당하

코드코드를 입력하고 확인하면서 중간중간에 제대로 나오는지 console.log 를 통해 수시로 체크하는 모습을 보았다.상수든 변수든 값을 넣어 선언을 해주어 베이스를 깔고 들어간다는거, 그리고 그 위치는 함수 안에 위치할 지 바깥에 위치할 지 잘 고려해야 한다는 점..

이거 이해하려고 12시? 부터 현재 오후 다섯시.. 반복해서 보다가.. 샌드위치먹다 배불러서 졸다가.. 이해가 된 것에 기쁘지만 다른 계획을 세운 것들에 시간 할애가 줄어드는데 이런 경우에는 어떻게 해야 할까? 나의 경우는 하다가 이해가 되지 않으면 거기서 진도가

1. momentum 따라하기 강의를 들으면서 단계별로 만들어가는 과정이다. 정말 이건 뭔가 싶을 정도로 이해가 안되는 부분이 있다면 거기서 또 한발자국도 나가지 않겠지만 강의 한 개씩 들어가며 따라해 보니, 다행히 그런 부분은 없었다. (이제 2개 들었음...) 2

setInterval (fn , miliseconds) 위의 제목처럼 setInterval 은 2가지 인자를 받는다. 첫 번째로 받는 인자는 실행할 함수를 받는다. 두 번째로 받는 인자는 그 함수를 실행시키고 싶은 시간, 실행할 시간 간격을 넣어준다. 보니까 밀리세컨