Ella 프론트엔드일지

0. map() 요약 1) 왼쪽 array 자료만큼 내부코드 실행해줌 2) return 오른쪽에 있는걸 array로 담아줌 3) 유용한 파라미터 2개 사용가능(map 안의 요소 데이터, 인덱스) 1. HTML 요소가 반복되고 있는 계획표가 있다. //App.js /*eslint-disable*/ import {useState} from 'react' import style from './App.css' function App() { let [날짜,날짜변경] = useState(['22일','23일','24일']) let [계획,계획변경] = useState(['빨래하기','청소하기','공부하기']) return ( 11월 {날짜[0]} 일정 밥먹기 운동하기 {계획[0]} 11월 {날짜[1]} 일정 밥먹기..

리액트 VS 자바스크립트 이벤트 처리하는 방법 비교 자바스크립트에서는 이벤트핸들러를 onclick 으로 표현 리액트에서는 onClick 으로 카멜케이스로 표시하고 있다. 또한 자바스크립트에서는 "" 안에 리액트에서는 {} 안에 함수를 넣고있다. 1) 함수를 만들어서 함수로 전달 Show name이라는 버튼을 클릭하면 ella라는 글씨가 콘솔창에 보이게 해주세요~ function Hello() { function showName() { console.log("ella"); } return ( Hello Show name ); } export default Hello; 2) 직접 이벤트리스너 안에 함수 전달 function Hello() { return ( Hello { console.log(28); }} ..

✅문제 원인 리액트를 처음 설치한 닝겐... APP.js 에서 jsx문법을 적용해서 태그를 바꾸니까 자꾸 아래와 같은 WARNING 표시가 뜬다. 물론...라이브서버에서 바뀐 태그가 잘 보여서 작업하는데는 문제 없는것 같아서 안바꿔도 될것같은데 거슬림.. 아래 warning 메세지의 뜻은 logo라는 변수는 쓰이지 않고 있다. post라는 변수도 쓰이지 않고 있으니 지워라~ 대충 요런뜻이다. 이런거 자꾸 나타나서 지우고 싶음 ✅해결방법 1) 코드를 집어넣는다. 그럴땐, App.js 등 자바스크립트 파일 맨 윗 상단에 아래와 같은 코드를 집어넣는다. Warning을 출력해주는 기능을 Lint 라고 하는데 Lint를 끄는 기능이다. /* eslint-disable */ 이렇게하면 밑에처럼 성공했다고 뜬다. ..