# Nomard

7개의 포스트
post-thumbnail

바닐라 JS 챌린지

1. 마우스 클릭 이벤트 2. 화면 사이즈 변경 이벤트 h1 tag 클릭시 글자색 변경 공통 먼저 HTML의 h1 tag를 JS에 가져와서 title이라는 변수에 담는다. 이 title에대한 이벤트와 함수를 addEventListener의 인자값에 넣는다. 함수 - Mouse click (handleTitleClick1) 마우스 클릭에 대한 함수는 총 4가지이다. 4가지 함수 모두 클릭을 하면 색상이 tomato, cornflowerblue가 번갈아가며 바뀌는 동작을 구현하였다. 이 함수는 css 속성값을 직접 가져오는 것이 가장 큰 특징이다. 현재 색상을 currentColor 변수에 할당하고 if조건문을 활용하여 newColor 변수에 각각의 조건에 맞는 색상을 할당하였다. 해당 방법은 element의 style을 js파일에서 변경하는 것이 큰 특징이다. 하지만 다른언어들을 섞는 것은 별로 좋지 않기에 이 방법은 지양하도록 한다

2022년 10월 1일
·
0개의 댓글
·
post-thumbnail

Movie_App - 2

이 부분 부터는 내가 혼자서 작업한 내용이다. 다음날 바로 문제를 해결했다. Link를 통해서 params로 전송을 해줄떄에는 이런식으로 Route태그 안에 직접 컴포넌트를 지정을 해주어야 한다. >이런식으로 작성하지 않으면 값이 전송이 되지 않는다. Link는 정상적으로 작동을 한다. 그후 값을 전송을 하여서 제목을 클릭을 하였을떄 해당 컴포넌트가 가지고 있는 값을 가지고 들어가 새로운 페이지에 보여주는 작업은 하였다. 사실 이부분은 css와 html부분만 수정하면 된다. 내가 곤란해 했던 부분은 앞서 설명한 params를 가지고 들어가는 부분이 였다.

2021년 9월 25일
·
0개의 댓글
·
post-thumbnail

Movie_App[Nomard 클론 코딩]

2021-09-24 하루만에 끝낸 클론 코딩이다. 이유는 단순히 HTML과 CSS조작만을 통해서 가능하기도 하고 내가 연습 용으로 해보았기 떄문이다. 사실 정규 과정이 끝난 것이지 추가적으로 내가 작업을 할수가 있다. 추가 적인 작업은 시간날떄마다 해볼것이다.!! 사실 많이 적을 것이 없다. 기본적으로 아는 것들이고 CSS가 어지러웠을 뿐이다. 그러기 떄문에 새로 알게된 사실만 적어 보도록 하겠다. 외부의 JSON값 받아오기 말 그대로 url에 있는 json의 값을 받아 오는 방법이다. axios를 사용하는데 npm을 통해서 따로 모듈을 설치해 주어야 사용이 가능하다. ![](https://images.velog.io/images/jjimgo/post/8d78d20a-ffd4-4827-a465-0

2021년 9월 24일
·
0개의 댓글
·
post-thumbnail

Nwitter -2 [Nomard 클론 코딩]

21-09-20 hook을 공부를 마치고 다시 시작을 하였다. 음 잠시동안 안하다가 하는 거라서 인지 어느 부분부터 정리를 해야할지 모르겠다. 그러기 때문에 최대한 모든것을 싹다 정리해 보겠다. App.js 모든 컴포넌트중 맨 위에잇는 컴포넌트 이다. 이 컴포넌트가 작동한 뒤에 뒤에 있는 컴포넌트 들이 작동하게 된다. useEffect를 통해서 최초에만 작동을 하게 하였고 만약 user에 변화가 있을시에 user가 로그인 되었을 시에 로그인 처리르 true로 하고 로그인된 유저의 정보를 저장한다. 이후 그 로그인된 사실과 정보를 Router로 전송을 하게 된다

2021년 9월 20일
·
0개의 댓글
·
post-thumbnail

Hook

useState 대표적인 Hooks이다. 이벤트 핸들러에도 유용하게 사용할수 있는 hook이라고 할수가 있으며 가장 많이 사용되는 기본적인 Hook이다. 기본적인 사용법이다. 해당하는 버튼이 눌렷을떄에 이벤트 핸들러 함수가 발동을 하게 되고 함수에서는 Hook의 값을 바꾸는 작업을 하게 된다. * 어렵지 않으니 바로 넘어가겠다 * useInput 가장 기본이 되는 useS

2021년 9월 18일
·
0개의 댓글
·
post-thumbnail

Nwitter [Nomard 클론 코딩]

21-09-14 작성 시작 코드를 천천히 적어가면서 하였는데 글이 모두 날라가서;; 최종 결과물을 통해서 정리를 해보겠다. -> 이해가 더 어려울것 같다. Router.js 기본적인 Router구문이다. 위에 있는 LoggedIn은 변수를 받는것이다. hoop변수 App.js Router에 주는 isLoggedIn은 여기에서 정의를 하였다. 이곳에서 정의한 이유는 역할을 나누기 위함이다. Router은 단순히 Router역할만 하게 만들어준 것이다. useEffet의 역할 firebase의 초기화가 너무 빨라서 로직이 적

2021년 9월 14일
·
0개의 댓글
·

[ 풀스택 ] 우버 클론 코딩 [ #1 ]

2020 하반기 업데이트 이후 시작

2020년 7월 30일
·
0개의 댓글
·