본문 바로가기

분류 전체보기

EXPERIENCED DESIGNER I'm Sunny. I am a UI/UX Designer | Web DesignerUI/UX & Project ManagerNuark Digital Agency, MI. US, May.2024 ~ Dec. 2024Hanmoe Soft, Seoul, South KoreaUI/UX/BX Design & Development Agency, Nov.2021 ~ Sep.2023InstructorThejoeun Academy, Seoul, South KoreaTeach (2D graphics, HTML, CSS, JS, Data Research and User Test, Storyboard & Components, Design Concept, Build Contents and Features, Modify pro.. 더보기
3.함수형컴포넌트 작성법 //함수형 컴포넌트 : props, api, hook(상태관리) 모두 다루는 방법이 다름 1. 컴포넌트를 정의하고, return(...);안에 jsx로 태그를 작성한다. const WrapComponent = ()=>{ return( ); } const HeaderComponent = () => {...} const MainComponent = () => {...} const Section1Component = () => {...} const Section2Component = () => {...} const FooterComponent = () => {...} const PopupComponent = () => {...} 2. 리액트 돔을 연동한다. ReactDOM.render( , document.g.. 더보기
2. 작성순서 & 기초문서 작성 0. 리액트 오픈소스 연결 1. DOM Container를 만들기(#root) 2. 3. 클래스형 컴포넌트 생성 - 웹제작에 필요한 섹션단위(영역)라고 생각하면 된다. - 예] 헤더, 메인, 섹션1, 섹션2..., 푸터 컴포넌트 등을 만들수 있다. - 클래스형 컴포넌트 생성 3-1. 클래스 네이밍 규칙 : 파스칼케이스 기법 3-2. extends로 확장/상속받는다. React.Component에서 상속 받는다. 4. render() 메소드를 만든다. 클래스 안에서 쓰는 ()는 모두 메소드. 4-1. return문에 의해서 태그들을 뿌려준다. 딱 하나만의 태그를 넣어야 함. 싱글!페이지 단위로 이동된다. 라우터가 이런 방식을 쓴다. 5. 리액트 돔 : component와 dom component를 연동 리.. 더보기
1. 리액트 진행 두가지 방식 1. 웹링크 - 곧바로 부분이든 전부이든 웹페이지 리액트 사용, 대규모 프로젝트엔 적합하지 않다. - 컴포넌트 생성(클래스형과 함수형 두가지), 템플릿 JSX를 다룬다. - 프롭스를 다룬다. props - 상태관리를 한다. statement - php, mysql 연동 (AXIOS로 연동) - 포트폴리오를 리액트로 제작한다. - 웹 호스팅에 배포 - 깃허브 배포 2. 앱제작 create-react-app : CRA / command line interface 또는module방식 - 웹방식에서 하는 모든 리액트 방식을 다 한다. - 상태관리 : 리덕스 - SPA : 라우터 - 배포는 웹배포와 다름. node.js환경에서 배포한다. - 따라서 깃허브에서 배포/ AWS / AZORE...(시간되면... 웹호스.. 더보기
자료형과 변수 #include void main1() { printf("자료형과 변수를 이용한 printf()함수 연습 프로그램 \n"); //정수형 short short_value = 100; int int_value = 1234; long long_value = 300L; unsigned int unit_value = 400; printf("short = %d, int=%d, long = %ld, unsigned int %u\n", short_value, int_value, long_value, unit_value); printf("8진수=%o, 16진수=%x\n", short_value, short_value); printf("%d\n", int_value); printf("%6d\n", int_value); p.. 더보기
git, git Hub -2. 깃 도메인 연결하기..작성중 작성중.. 더보기
git, git Hub -1. 작업환경 설정 및 프로젝트 업로드 1. git 다운로드 : git 검색 2. github.com 가입 아이디 생성 3. 폴더 안에서 우클 > git bash 확인 4. git bash cmd에서 아래 내용 치고 들어감 1) git init 2) git remote add origin 주소(git에서 레포지토리주소 복사 http주소.git) 주의 : remote가 이미 존재한다는 에러가 발생했을때는 아래처럼 remote를 remove하고 다시 remote해 준다. [[[[[[[[[[[ git remote remove origin ]]]]]]]]]]]]]]] $ git remote add origin https://github.com/..../tutorial.git error: remote origin already exists. 리모트 했.. 더보기
vscode 편리한 팁 많이 사용하는 것 참조 https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf visual studio code의 확장메뉴 설치 거의 필수 더보기
vscode 마우스휠로 화면확대 Ctrl +를 누르면 인터페이스 전체가 확대되어 화면영역을 차지하게 된다. 아래와 같은 방법을 사용하면 인터페이스 화면영역의 크기와 상관 없이 코드영역의 크기만 조절 가능하다. File>Preferance>Settings>Text Editors>mousewheel검색하여 체크해 둔다. 이렇게 하면 화면의 글자크기를 마우스휠로 조정이 가능해 진다. 더보기
유용한 화면캡처 1. print screen + Window + alt 현재 활성화 된 창을 캡처하여 폴더에 저장한다. 순서대로 모든 파일이 폴더(사용자>동영상>캡처폴더)에 모두 저장되어 있다. 2. 브라우저 화면 캡처 : 크롬 F12개발자 도구 -> Ctrl + shift + P -> screenshot 검색 전체화면을 스크린캡처할 때 편하다 3. 크롬 웹스토어에서 Nimbus 활용 - 서비스여부 확인이 필요하다 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
web Service Lead Planning 더보기
UI/UX planning 더보기
UI/UX planning 더보기
prototype 더보기
prototype 더보기

티스토리툴바