전체 글
https://mui.com/material-ui/getting-started/installation/ mui를 꼭 npm한 후 진행 import * as React from "react"; import { useTheme } from "@mui/material/styles"; import Box from "@mui/material/Box"; import MobileStepper from "@mui/material/MobileStepper"; import SwipeableViews from "react-swipeable-views"; import { autoPlay } from "react-swipeable-views-utils"; import styled from "styled-components"; ..
[소프트웨어 설계]디자인패턴- 객체지향언어와 사용한다.-생성, 구조, 행위- 생성(싱글톤, 프로토타입, 팩토리, 빌더 등)- 구조( 어답터, 브릿지, 데코레이터, 컴포지트, 프록시 등)XP의 5가지 원칙피존의용단럼바우 다이어그램객-객체동-상태기-자료(DFD)객체지향 설계 원칙 SOLIDSRP-단일책임원칙 (하나의 기능은 하나만)OCP-개방폐쇄원칙 (수정은 좁게 확장은 넓게)LSP-리스코프 치환의 원칙(하위는 상위 치환 가능)ISP-인터페이스 분리의 원칙(인터페이스 간 영향x)DIP-의존성 역전의 원칙(하나 변화로 인해 많은 것 의존 X)아키텍처 패턴-계층화-파이프필터-마스터슬레이브-피어투피어-모델뷰컨트롤러-클라이언트서버코드의 종류순차코드(순서대로)표의숫자코드(중량, 면적 등 표현)연상코드(TV-2022 ..
고객님 준비사항1. 디자인(레이아웃) [지디웹, PPT, Figma, ColorHunt]2. 스토리 보드(기능 설명, 페이지 이동 등) [PPT]3. 사진 영상 등 에셋자료 [핀터레스트, 프리픽, 플렛티콘]4. 깃허브, 가비아 회원가입 [깃허브, 가비아] 본인 유의사항1. 오픈채팅으로 소통 [카카오톡]2. 견적 기간 설정3. 결제 요청4. 작업물 전달5. 구매 확정 요청참고 사이트1. 지디웹(홈페이지 디자인 수상작 사이트)2. 핀터레스트(무료 이미지 사이트)3. 프리픽(무료 이미지 사이트)4. 플렛티콘(무료 아이콘 사이트)5. 컬러헌트(색상 모음 사이트)6. 피피티, 피그마 (디자인 툴)
https://inplaza.com/puny/index.php도메인>한글도메인 변환기 퓨니코드(Punycode)란...? 다국어 도메인의 표준화 작업이 이루어지기 전에는 Verisign의 한글도메인 연결방식이 [레이스코드]와 [퓨니코드]를 병행해서 사용하였는데, " data-og-host="inplaza.com" data-og-source-url="https://inplaza.com/puny/index.php" data-og-url="https://inplaza.com/puny/index.php" data-og-image=""> 한글도메인 퓨니코드 변환기홈>도메인>한글도메인 변환기 퓨니코드(Punycode)란...? 다국어 도메인의 표준화 작업이 이루어지기 전에는 Verisign의 한글도메인 연결방식이 ..
import styled from 'styled-components'; // 기본 스타일 const Button = styled.button` background-color: ${(props) => (props.primary ? 'blue' : 'green')}; color: ${props => props.color || 'black'}; /* props로 전달된 color 값이 없으면 기본값은 검정색 */ padding: 10px; border: none; `; // 예제에서 사용할 컴포넌트 const MyComponent = () => { return ( {/* primary prop이 true인 경우 파란색 배경, 그렇지 않으면 녹색 배경 */} Primary Button Secondary Butt..
// eslint-disable-next-line react-hooks/exhaustive-deps 추가 // 예시 useEffect(() => { calcSumApplication(); // eslint-disable-next-line react-hooks/exhaustive-deps }, [allApplication]);