본문 바로가기
728x90
반응형

전체 글400

[리액트] 데이터 바인딩 차이 ( 변수 / 컴포넌트 ) 변수 데이터 바인딩다른 js 파일에 있는 html 데이터 바인딩다른 파일로 빼서 변수에 담은 후, export let data = [ { id: 0, title: "White and Black", content: "Born in France", price: 120000, }, { id: 1, title: "Red Knit", content: "Born in Seoul", price: 110000, }, { id: 2, title: "Grey Yordan", content: "Born in the States", price: 130000, },];export default data;다른 파일 생성 후, array 배열 데이터를 변수.. 2024. 6. 4.
Redux 3 : store의 state 변경하는 법 보호되어 있는 글 입니다. 2024. 6. 3.
Redux 2 : store에 state 보관하고 쓰는 법 보호되어 있는 글 입니다. 2024. 6. 2.
장바구니 페이지 만들기 & Redux 1 : Redux Toolkit 설치 보호되어 있는 글 입니다. 2024. 6. 1.
props 싫으면 Context API 써도 됩니다 보호되어 있는 글 입니다. 2024. 5. 31.
멋있게 컴포넌트 전환 애니메이션 주는 법 (transition) 보호되어 있는 글 입니다. 2024. 5. 29.
[리액트] 탭 UI 생성 (state 활용) / props 축약 / if 문 생략 탭 UI 생성1. html css로 디자인 미리 완성해놓고2. UI의 현재 상태를 저장할 state 하나 만들고 (버튼)3. state에 따라서 UI가 어떻게 보일지 작성 (환경)1. html css로 탭 디자인 미리 완성Detail.js 에서 >> 버튼0 버튼1 버튼2 react-bootstrap 사이트에서 복사해서 Detail 페이지 넣기.import { Nav } from "react-bootstrap";갖다 쓰려면 import 필수. 버튼마다 event key를 잘쓰라고 돼있음 작명을 각각 다른이름으로 함. defaultActiveKey (옵션으로 사용 가능)= 기본으로 눌려있을 버튼이벤트 키 중에 아무거나 집어넣기 = link0.. 2024. 5. 29.
[JS/리액트] Ajax 한 눈에 보기 ( jquery / axios 의 공통점과 차이점) AJAX요청 JS - jQuery 로 요청$.get('https://codingapple1.github.io/hello.txt').done(function(){ });리액트 - axios 로 요청 axios.get("https://codingapple1.github.io/shop/data2.json").then(function(){ });axios.get("https://codingapple1.github.io/shop/data2.json").then(() => { });jQuery의 $.get와 Axios의 axios.get의 공통점공통점 >.done 아니면 .then 뒤에 붙이고 콜백함수넣고 파라미터(data - 작명 자유롭게) 하나 만들기$.get('https://codingapple1.github.. 2024. 5. 28.
[리액트] ajax(get/post), fetch ajax 사용하기AJAX로 GET/POST 요청서버에 GET, POST 요청을 할 때 새로고침 없이 데이터를 주고받을 수 있게 도와주는 간단한 브라우저 기능사용 전 준비 >>button 생성 {/* 메인페이지 */} {/* 맵 함수 사용 */} {shoes.map((a, i) => { // 컴포넌트 사용 return ; })} {/* ajax 버튼 생성 */} .. 2024. 5. 28.
728x90
반응형