목록FE (5)
이것저것 해보기🌼
1. 설치creat-react-app 으로 시작하기npm create-react-app my-redux-project typescriptnpm install redux --save 2. 간단한 덧셈, 뺄셈 기능 만들기- index.tsximport React from 'react';import ReactDOM from 'react-dom/client';import './index.css';import App from './App';import reportWebVitals from './reportWebVitals';import { createStore } from 'redux';import counter from './reducers';const root = ReactDOM.createRoot( doc..
https://icon-icons.com/ko/ 무료 아이콘 SVG, PNG, ICO 또는 ICNS검색 새로운 Iconsets Planets Business management Business icons Music Instruments DIY and Crafts Linance Morning Routine Productivity Success illustrationicon-icons.com
SSR (서버 사이드 렌더링) 과 CSR (클라이언트 사이드 렌더링) SSR표시되어야할 html 파일을 브라우저가 다운 받고, javascript 파일도 다운 받는다.javascript 를 다운 받는 동안 이미 html 렌더링을 시작하기 때문에 웹페이지 표시가 빠르다.사용자가 페이지를 이동했을때 해당 페이지의 html 파일을 다운받고, javascirpt 파일을 다운받는 과정이 반복된다.렌더링은 빠르지만, 페이지 이동 시 마다 화면 깜박임이 생긴다. CSR사용자가 url 요청시 웹문서가 가지고 있는 모든 정보, 링크 페이지까지 한번에 다 받아온다.초기 화면 로드가 느리지만, 그 뒤로 사이트를 돌아다닐때는 로드 과정이 없어 사용성이 좋다.보통 로드가 될때 loading 임을 알려주는 화면이 먼저 표시되게 ..
Vue 프로젝트를 시작했는데, eslint 를 적용하려하니 발생하는 오류에 대한 로그다. 1. package.json { "name": "webpack-template", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "dev": "webpack-dev-server --mode development", "build": "webpack --mode production" }, "keywords": [], "author": "", "license": "ISC", "devDependencies": { "@babel/core": "^7.24.4", "@babel/plugin-transform-runtime": "^7.24.3", "..
/* 상속되는 CSS 속성들 : 글자, 문자 관련 */ font-style, font-size, line-height, color, text-align, ... /* 강제 상속시키기 */ .child { height: inherit; } 기본 문법 /* 주석 */ div { color: red; margin: 20px; } 선언 방법 /* 내장 방식 (HTML) */ /* 인라인 방식 (HTML) */ /* 링크 방식 (HTML) */ /* import 방식 (CSS) */ @import url("./common.css") 선택자 /* 모든 요소 */ * {} /* CLASS 속성의 값이 'ABC' */ .ABC {} /* CLASS ID 속성의 값이 ABC */ #ABC {} /* 두가지 이상. spa..