본문 바로가기

분류 전체보기155

[REACT] 이벤트 리스너 이벤트 다루는 법 onClick = {클릭될 때 실행할 함수} onClick = { () => {실행할 내용}} 함수를 변경하고 싶을때 state의 변경함수를 이용해서 재렌더링이 잘 일어난다. /* eslint-disable */ //터미널에 뜨는 warning 안보이게 할때 import React, { useState } from 'react'; //react에 있는 내장함수 하나를 쓰겠습니다. import logo from './logo.svg'; import './App.css'; function App() { let [글제목, 글제목변경] = useState(['남자 코트 추천', '부산 우동맛집', '파이썬 독학']); let [따봉, 따봉변경] = useState(0); let posts = .. 2021. 7. 21.
[REACT] state 1 리액트의 데이터 저장공간 state 만드는법 - state는 변수 대신 쓰는 데이터 저장공간 - {useState}를 상단에 첨부 - useState()라는 함수를 이용해서 만들어야 한다. - 문자, 숫자, array, object 모두 저장 가능. // array를 저장했을 때 //let [글제목, 글제목변경] = useState(['남자 코트 추천', '강남 우동 맛집']); // {글제목[0]} 으로 출력할 수 있다. 2 state에 데이터를 저장해놓는 이유 - 웹이 App처럼 동작하게 만들고 싶어서. - state는 변경되면 HTML이 자동으로 재렌더링 된다. - 그냥 변수로 만들어놓은 HTML은 바뀌어도 자동 렌더링이 안됨. - 제목을 정렬하든가 제목을 수정하면 새고로침 없이도 HTML에 렌.. 2021. 7. 21.
[REACT] JSX 기본 문법 react 를 사용하는 이유 - web-app을 만들 때 가장 유용한 라이브러리가 react/angular/vue. - 모바일앱으로 발행이 쉬움 - 앱처럼 뛰어난 ux JSX - Javascript에서 확장된 문법으로 html처럼 생겼으나 다른 문법이다. 1 태그에 class를 주고 싶을때 2 데이터 바인딩(변수, 함수, 이미지, 속성 등 모두 가능) - 서버에서 가져온 데이터를 보여주는 것. - {변수명} 이렇게 그대로 사용해서 가져올 수 있다. function App() { let posts = '부산 고기 맛집'; return ( 개발 Blog {posts} ); } export default App; - {함수} function App() { let posts = '부산 고기 맛집'; functi.. 2021. 7. 21.
[Javascript Algorithms] 1-6 홀수 7개의 자연수가 주어질 때, 이들 중 홀수인 자연수들을 모두 골라 그 합을 구하고, 고른 홀수들 중 최소값을 찾는 프로그램을 작성하세요. 입력 설명 첫 번째 줄에 자연수 7개가 주어진다. 주어진 자연수는 100보다 작다. 홀수가 한 개 이상 반드시 존재한다. 출력 설명 첫째 줄에 홀수들의 합을 출력하고, 둘째 줄에 홀수들 중 최소값을 출력한다. 2021. 7. 21.
[Javascript Algorithms] 최솟값 구하기 2021. 7. 21.
[Javascript] preventDefault a태그나 submit 태그는 누르게 되면 href를 통해 이동하거나, 창이 새로고침하여 실행된다. 이때 preventDefalut를 통해 이러한 동작을 막아줄 수 있다. event.preventDefault() 2021. 7. 20.
반응형

티스토리툴바