전체 글158 [React] axios(내용 추가하기) 1 axios란? 브라우저, Node.js를 위한 Promise API를 활용하는 http 비동기 통신 라이브러리. 2 axios 특징 - 운영 환경에 따라 브라우저 XMLHttpRequest 객체 또는 Node.js의 HTTP API 사용. - Promise(ES6) API 사용 - 요청과 응답 데이터의 변형 - HTTP 요청 취소 및 요청과 응답을 json 형태로 자동 변경 2021. 8. 16. [React] map 응용2(portfolio) import React from 'react'; import Header from '../layout/Header'; import Layout from '../layout/Layout'; import Title from '../basics/Title'; import FooterInfo from '../basics/FooterInfo'; function Port({link, image, title, category}){ return( {title} {category} ) } const portfolioInfo = [ { id: "1", link: "https://webstoryboy.github.io/portfolio/port2/", image: "../img/port01.jpg", title: "PORT.. 2021. 8. 16. [React] map 응용하기 html 꿈을 설계하고 디자인 하다. 나는 공간을 만드는 것을 좋아한다. 어려을 때부터 나만의 공간을 만드는 것을 좋아했고 나만의 다락방을 좋아했다. 단 한 사람이라도 내가 만든 공간 속에서 영감을 받거나 마음이 움직였으면 좋겠다. 서울에는 집이 없지만, 이곳에서는 나만의 집이 많다. 그 집은 비용도 들지 않고 언제든지 만들 수 있다. 나만의 공간을 마음것 만들 수 있다는 건 엄청난 매력인거 같다. 그 한구석에 나만의 꿈을 설계하고 디자인을 하며 앞으로도 살고 싶다. 열심히 할수록 기회는 따른다. 운이 좋은 사람은 없다. 단지 운을 만들 뿐이다. 운을 만들기 위해서는 내가 좋아하는 일이나 내가 하고 싶은 일에 몰두하면 된다. 몰두 하다보면 길이 보이고 방향이 보이게 된다. 운이란 고된 노동과 노력을 통해.. 2021. 8. 16. [React] 클래스형 컴포넌트 1. 클래스형 컴포넌트 react 컴포넌트 선언하는 두가지 방식 중 하나. 현재 자주 사용하지 않지만, 사용하는 기업들이 있으므로 그 프로젝트의 유지보수를 위해서는 클래스형 컴포넌트에 대한 개념은 알고 있어야한다. componentDidMount() 마운트된 직후, 즉 트리에 삽입된 직후 호출된다. import React from 'react'; import Header from '../layout/Header'; import Footer from '../layout/Footer'; class Main extends React.Component{ state = {}; componentDidMount(){ } render(){ return( We Provide visual coding solutions f.. 2021. 8. 16. [React] map 1 map 배열 안의 모든 자료에 똑같은 작업을 하나씩 시켜주고 싶을 때 사용하는 내장 함수 import React from 'react'; import Header from '../layout/Header'; import Footer from '../layout/Footer'; function Info({text}){ return( {text} ) } const textInfo = [ {text : "WE PROVIDE"}, {text : "VISUAL CODING"}, {text : "SOLUTIONS"}, {text : "FOR YOU WEBS"} ] function Main(){ return( {textInfo.map((el) => ( ))} ); } export default Main; 2021. 8. 16. [React] 객체 생성 및 객체 호출 객체 생성 const textInfo = "Hello" const textInfo = { text1 = "WE PROVIDE", text2 = "VISUAL CODING", text3 = "SOLUTIONS", text4 = "FOR YOU WEBS" } 객체 호출 function Main(){ return( ) } 2021. 8. 16. 이전 1 ··· 16 17 18 19 20 21 22 ··· 27 다음 반응형
