soso-tip
soso-tip copied to clipboard
๐ฏ์์ํ ํ๋ค๊ณผ ์ ๋ฆฌ, ๋ฒ๊ทธ ํด๊ฒฐ๊ธฐ๋ฅผ ๋ชจ์๋๋ ๋ ํฌ
Flex๋ฅผ ์ฌ์ฉํด๋ ๋๊ณ , transform์ ์ฌ์ฉํด๋ ๋๋ค. ## transform ```css .parent{ ใposition:relative; } .child{ ใposition:absolute; ใtop:50%; ใleft:50%; ใtransform: translate(-50%,-50%); ใbackground-color:#666; } ```
## Description GitHub์ ์ด์ฉํด์ npm package๋ฅผ ๊ด๋ฆฌํ ์ ์๋ ๊ธฐ๋ฅ์ด ์คํ๋์๋ค. (2019.12.2 ๊ธฐ์ค ์์ง Beta) ์ด ๊ณผ์ ์์ ๋ช ๊ฐ์ง ์๊ฒ ๋์ ๊ณผ ์ฝ์ง๊ธฐ๋ ๋ค์๊ณผ ๊ฐ๋ค. ### cli๋ฅผ ์ฌ์ฉํ ์ ์๋ ์ด์ ...
## ๐ Desc eslint ์ค์ ์ผ๋ก ์ฝ๋ฉ Formatting์ ์๋ํ ํ๊ณ , ์ด๋ฅผ **์ ์ฅํ ๋๋ง๋ค ์๋์ผ๋ก ๊ณ ์ณ์ฃผ๋** ์ ํ ์ด๋ค. CRA๋ฅผ ๊ธฐ๋ฐ์ผ๋ก ์ค์ ํ ๋์๋ dependency๋ค์ด ๊ธฐ๋ณธ์ผ๋ก ์ค์น๋์ด ์๋๋ฐ, CRA์์ด ์ง์ ์ ํ ํ๋ ๊ฒฝ์ฐ์๋ plugin์ด๋ config๋ฅผ ํ๋ํ๋ ์ก์์ฃผ์ด์ผ ํ๋ค....
## Desc eslint์ค์ ํ์ผ์ด ํด๋์ root๊ฐ ์๋๋ผ ํน์ ํด๋์ ์๋ ๊ฒฝ์ฐ `workingDirectories` ๋ฅผ ๋ช ์ํด์ฃผ์ด์ผ ํ๋ค. ```js "eslint.workingDirectories": ["./client"], ``` ### Plus, Autofix ์ค์ auto fix๋ฅผ ์ ์ฉํ ์ ์ฒด vscode์ค์ ์ ์ด๋ ๋ค. ```js...
css๋ง์ผ๋ก ๋ฐ์ํ๋(?) ui๋ง๋ ์์๋ชจ์ https://dev.to/adrianbdesigns/you-can-create-these-elements-without-javascript-525a
![image](https://user-images.githubusercontent.com/18658235/67838790-7d90f080-fb35-11e9-84ac-28e5943bcd3a.png) ๋ชจ๋ ํ์ ์ ์ ๋ง์ถฐ์ฃผ์์์๋.. ์์๊ฐ์ ์๋ฌ๊ฐ ๋๋ ๊ฒฝ์ฐ๊ฐ ์๋ค. ์ด๋ `tsconfig.json` ์์ `allowJS: true` ์ค์ ์ ์ญ์ ํด์ฃผ๋ฉด ๋๋ค. > JS ํ์ผ์ app.tsx์์ ํด์๋์ง ์๋๋ก ํจ. (์ฉ ์ข์ ๋ฐฉ๋ฒ์ ์๋๊ฒ ๊ฐ์ง๋ง,...
## Desc ์ด๋ฏธ์ง `onLoad` ๋ฅผ ํตํด ์ด๋ฏธ์ง ๋ก๋๊ฐ ์๋ฃ๋ ์์ ์ ํ์ํ ์์ ๋ค์ ์ํํ ์ ์์ง๋ง, ์ด๋ฅผ ์กฐ๊ธ๋ ํจ์จ์ ์ผ๋ก ๊ด๋ฆฌํ ์ ์๋ค. ```jsx componentDidMount() { const img = new Image(); img.src...
## Desc ์นํฉ ์ ํ ํ ๋ ๊ฝค ์ข์๋ ์ ๋ค ### CSS path name ``` { test: /\.s?css$/, use: [ 'style-loader', { loader: 'css-loader', options: { importLoaders: 1, modules: true, localIdentName: '[path]_[local]', sourceMap:...
## Desc `vendor.bundle.js` , `app.bundle.js` ๋ก ํ์ผ์ด ๋ถ๋ฆฌ๋์๋๋ฐ, ์ด ๋ถ๋ถ์ ๋์ณ์ ๋ธ๋ผ์ฐ์ ์์ ๋์ํ์ง ์์๋ค. express์ pugํ์ผ์ ์ด์ฉํด์ ๊ทธ๋ฆฌ๋ ๋ถ๋ถ์ธ๋ฐ, pugํ์ผ์ script๋ฅผ ๋ช ์์ ์ผ๋ก ์ถ๊ฐํด์ฃผ์ด์ผ ํ๋ค.
## Desc [CRA Issue Rise](https://github.com/facebook/create-react-app/issues/7657) ~~ํ์ฌ๋ ๋ซํ ์ํ์ด๋ค.~~ Create React App ์ผ๋ก ํ๋ก์ ํธ๋ฅผ ์์ฑํ๊ณ , [craco](https://github.com/sharegate/craco) ๋ฅผ ์ด์ฉํด์ post css ์ค์ ์ ์ก์์ฃผ์ด๋ ์ฌ์ ํ `.pcss` ๋ฅผ ๋ถ๋ฌ์ฌ ์ ์๋ ๋ฌธ์ ๊ฐ ์๋ค. >...