코딩공부(129)
-
[운영체제] 프로세스 생성 과정
프로세스란? CPU에 의해서 현재 실행되고 있는 프로그램 프로세스의 상태 Ready 상태 프로세스가 처리기(CPU)를 사용하지 있지는 않지만 언제든 사용할 수 있는 상태 프로세스가 처리기의 배정을 기다리고 있는 상태 다른 프로세스 실행을 위해서 일시적으로 정지해 있는 상태 CPU에 의해 처리되기 위해 주기억 장치에 존재하는 상태 Run 상태 프로세스가 CPU를 차지하고 있는 상태 프로세스의 명령이 실행되고 있는 상태 Block, Wait, 보류 상태 프로세스가 어떤 사건이 일어나기를 기다리고 있는 상태 처리속도가 느린 I/O(입출력) 작업 중인 상태 외부적인 사건이 생길 떄까지 실행할 수 없는 상태 프로세스 생성과정 먼저 프로세스가 생성이 되려면 파일 시스템의 그 대상이 되는 exe파일이 있어야 한다. ..
2022.04.13 -
Styled-components Pseudo selectors 2
${styled-component명} {} import React from 'react'; import styled from 'styled-components'; import { keyframes } from 'styled-components'; ... // ${styled-component명} {} // 이런식으로 스타일 컴포넌트 안에서 셀렉해주면 // 그 컴포넌트가 어떤 태그이든 상관없이 css를 줄 수 있다. const Emoji = styled.span` font-size: 36px; `; const Box = styled.div` height: 200px; width: 200px; background-color: tomato; display: flex; justify-content: center..
2022.03.29 -
왜 Styled-components를 쓰는가?
react에서 styled components를 안쓰고 css 적용하는 세가지 방법 1. inline css js code를 써서 별로 hover도 못씀 2. 전역 css e.g)index.css 코드가 전역에 적용되어 세부 조정하기가 힘듦 3. 파일이름.module.css 모듈 방식 계속 className을 복붙해줘야함 styled-components의 장점 이해하기 쉽고 쓰기도 용이함 css 파일을 확인하지 않아도 해당 div가 어떤역할을 하는지 알 수 있다 - 스타일링된 컴포넌트를 쓸 수 있는데 컴포넌트 함수 안에 스타일을 써줄 필요가 없음 - 알아보기 더 쉬운 컴포넌트 이름을 정할 수 있음 - 같은 스타일 컴포넌트를 한가지 스타일 value만 바꿔서 여러번 쓸 때 props를 인자로 받아서 해당 ..
2022.03.29 -
Styled-components Pseudo selectors
Pseudo selectors import React from 'react'; import styled from 'styled-components'; import { keyframes } from 'styled-components'; const Father = styled.div` display: flex; `; const animation = keyframes` from { transform: rotate(0deg); } to{ transform: rotate(360deg); } `; // Box안에 있는 span태그를 // 아래와 같은식으로 부모 styled components를 통해 target 가능 const Box = styled.div` height: 200px; width: 200px; ba..
2022.03.29 -
Styled-components Animation
import { keyframes } from 'styled-components'; import React from 'react'; import styled from 'styled-components'; import { keyframes } from 'styled-components'; const Father = styled.div` display: flex; `; const animation = keyframes` from { transform: rotate(0deg); } to{ transform: rotate(360deg); } `; const animationTwo = keyframes` 0% { transform: rotate(0deg); border-radius: 0px; } 50% { tra..
2022.03.29 -
Styled-components 태그 속성 한번에 주기
import React from 'react'; import styled from 'styled-components'; const Father = styled.div` display: flex; `; // attrs({key: value, key:value, ...}) // 이런식으로 한번에 태그 속성을 줄수도 있음 const Input = styled.input.attrs({ required: true, minlength: "10" })` background-color: tomato; `; function App() { return ( ); } export default App;
2022.03.29