render(2)
-
react hooks의 등장으로 거의 대체된 render props 방식
Render Props는 리액트에서 컴포넌트 간에 코드 재사용을 쉽게 하기 위한 패턴이다. 주로 함수형 컴포넌트에서 사용되며, 컴포넌트의 props로 함수를 전달받아 렌더링 동작을 동적으로 정의할 수 있다. Render Props 기본 예제 function DataFetcher({ render }) { const data = { name: 'Alice', age: 25 }; // 가상의 데이터 return {render(data)};}function App() { return ( Name: {data.name}, Age: {data.age}} /> );}DataFetcher 컴포넌트는 render라는 prop으로 함수를 받는다.이 함수는 데이터를 렌더링할..
2024.11.26 -
[EJS] res.render("ejs파일경로", {데이터이름표: 전송할데이터})
Node.js에서, 서버를 담당하는 entry point는 웹앱의 두뇌라고 할 수 있다. 그리고 그 js파일 상의 로직으로 인해 변경되는 값을 HTML로 즉각 쏴주는 것이 EJS다. 이때 entry point -> EJS로 데이터를 전송하는 역할을 하는 함수가 render() 함수이다. 만약 EJS를 사용하지 않고 기본적인 HTML만을 사용한다면, 클라이언트로부터 온 request에 대한 response를 일일이 send 또는 sendFile 해야할 것이다. 하지만 EJS는 기존 HTML코드와 JavaScript코드의 공존을 통해 효율적인 개발을 도와준다. render() 함수를 사용하기 위해 우리는 역시나 Node Express 상의 get() 또는 post() 함수를 이용한다. 예를 들어 사용자로부터..
2020.05.10