본문 바로가기
react - Component로 props 전달하기(Passing Props to a Component) Component로 props 전달하기(Passing Props to a Component) React의 Component는 props를 사용하여 서로 객체, 배열 및 함수를 포함하여 모든 자바스크립트 값등의 데이터를 주고받는다. Familiar props props는 JSX 태그에 전달하는 정보를 의미한다. 아래의 코드에서 img 태그 안에 있는 className, src, alt, width, and height 는 정보를 전달하기 때문에 props라고 한다. function Avatar() { return ( ); } component에 props를 전달하는 방법(Passing props to a component) export default function Profile() { return ( ).. 2021. 11. 3.
port 사용여부 확인 > netstat -tulpn | grep [:port] 2021. 11. 2.
React - 중괄호{ } 가 있는 JSX의 JavaScript JavaScript in JSX with Curly Braces Passing strings with quotes JSX에 string을 이용하여 정적으로 속성을 전달하려면 ' ' 또는 " " 로 사용한다. 하지만 동적이게 만들기를 원한다면 { }를 사용해야한다. { } 를 사용하면 JSX에서 바로 JavaScript를 사용할 수 있다. export default function Avatar() { return ( #정적 #동적 ); } Using curly braces: A window into the JavaScript world { }안에서 JavaScript 표현은 변수 뿐만 아니라 함수 또한 항상 동작한다. !주의 - 태그에 { }를 사용할 수는 없다. 예) - " " 안에 { }를 사용하면 문.. 2021. 11. 2.
React - Writing Markup with JSX Writing Markup with JSX https://beta.reactjs.org/learn/writing-markup-with-jsx React Component는 React가 브라우저에 렌더링하는 일부 마크업을 포함할 수 있는 JavaScript function 이다. React Component는 JSX라는 구문확장을 이용하여 화면에 보여질 수 있다. JSX는 HTML 과 비슷하지만 조금 더 엄격하고, 동적인 정보를 표시할 수 있다. The Rules of JSX JSX는 HMTL 처럼 보이지만 사실은 그 아래에서는 JS 객체로 변환된다. 이로인해 HTML과 JSX는 비슷한지만 유의해서 써야할 점들이 생긴다. 1. Return a single root element JSX는 JavaScript.. 2021. 11. 1.
docker image VS docker container docker docker는 응용 프로그램 개발을 쉽고 단순화 하기 위해 설계된 SW이다. docker image docker image는 app이 동작하는데 필요한 소스코드, 라이브러리, dependencies, tool 등을 갖고 있는 변하지 않는 파일이다. 애플리케이션이 잘 동작할 때의 상태를 스냅샷 찍는다고 생각할 수 있다. 그래서 이미지는 only read 이다. docker container 호스트 시스템과 분리되어 애플리케이션을 작동하기 위해 필요한 라이브러리나 애플리케이션 등을 모아놓은 것이다. 이는 별도의 서버인 것처럼 사용할 수 있다. 컨테이너를 생성할 때 사용되는 옵션과 이미지에 의해 컨테이너는 정의되어진다. 만약 컨테이너가 제거되면 영구 저장소에 저장되지 않은 상태의 변경사항은 삭제되.. 2021. 10. 29.