wrkbrs

https://spectrum.chat/next-js/general/page-flashes-when-using-styled-components-in-custom-document-js~46d0f12c-d21e-4657-94e6-2a4290e4875b Page flashes when using styled-components in custom _document.js · Next.js Hey! I'm using styled-components along with next.js and everytime i refresh the page, I see a flash. At first I thought this would be limited to development… spectrum.chat https://gith..

.babelrc { "env": { "development": { "plugins": [ ["styled-components", { "ssr": true, "displayName": true, "preprocess": false } ] ], "presets": ["next/babel"] }, "production": { "plugins": [ ["styled-components", { "ssr": true, "displayName": true, "preprocess": false } ] ], "presets": ["next/babel"] } }, "plugins": [ ["styled-components", { "ssr": true, "displayName": true, "preprocess": fals..

onClick of both child and parent triggered when child is clicked class Sample extends React.Component { constructor(props) { super(props); this.handleChild = this.handleChild.bind(this); this.handleParent = this.handleParent.bind(this); } render() { return ( hello ); } handleParent(e) { console.log('parent'); } handleChild(e) { console.log('child'); } } output when child is clicked child parent ..

* ON DELETE SET NULL * ON UPDATE SET NULL 옵션 SET NULL -> 부모테이블에서 primary 값이 수정 또는 삭제될 경우 하위테이블의 reference값은 존재할 수 없습니다. 옵션이 없을 경우는 에러가 발생하고 옵션 SET NULL 로 정의되면 하위테이블의 reference값이 NULL 값으로 변경되면서 참조무결성을 유지합니다. * ON UPDATE CASCADE 옵션 CASCADE -> 부모테이블에서 primary 값이 수정될 경우 옵션 CASCADE 로 정의되면 하위테이블의 reference값은 변경된 상위테이블의 수정된 값을 가지면서 참조무결성을 유지합니다. * ON DELETE CASCADE 옵션 CASCADE -> 부모테이블에서 primary 값이 삭제될 ..

ReferenceError: window is not defined 에러 발생 시 아래와 같은 방법을 사용 + const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; + const store = createStore(reducer, /* preloadedState, */ composeEnhancers( - const store = createStore(reducer, /* preloadedState, */ compose( applyMiddleware(...middleware) )); 리덕스 확장프로그램을 사용할 경우 발생하는 에러인데 window.__REDUX_DEVTOOLS_EXTENSION__ 를 사용중이라면 위..

일정 시간이 지나면 가로로 넘어가는 슬라이드를 만들어보자. 준비물은 다음과 같다. div 하나, 가로로 쭉 이어붙인 li 다섯개, 그 li 다섯개의 총 너비와 같은 너비를 가진 ul 하나! 여기에 필자는 알아보기 좋게 배경색과 border를 좀 추가해서 준비했다 코드로 보면 아래와 같다 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 슬라이드 무한 슬라이드 body * { height: 50px; } .slide_box{ width: 200px; position: rela..

editor.hover.enabled: false in settings.json to Tooltip Click on Edit in settings.json There are two panes Default User Settings "editor.quickSuggestions": { "other": false, "comments": false, "strings": false } User Settings "editor.parameterHints.enabled": false, "editor.suggest.snippetsPreventQuickSuggestions": false, "html.suggest.html5": false, "editor.snippetSuggestions": "none", This also..

Settings -> Appearance & Behavior -> Appearance -> Widescreen tool window layout https://intellij-support.jetbrains.com/hc/en-us/community/posts/206721315-Full-width-bottom-pane-is-a-waste-of-space

Visual Studio Code (VScode) 테마 적용 후 일부 텍스트에 적용된 이탤릭(italic)체나 굵기(bold) 설정을 변경하고 싶은 경우 settings.json 파일에 다음과 같이 설정을 덮어써주면 된다. (settings 파일을 찾을 수 없다면 Settings 메뉴에 들어가서 Token Color Customizations를 검색해서 edit in settings.json을 클릭한다.) "editor.tokenColorCustomizations": { "textMateRules": [{ "name": "이름", "scope": ["범위"], "settings": {"속성명": " 속성값", } }] } name은 굳이 꼭 쓰지 않아도 되지만 어떤 설정인지 알 수 있도록 설정해준다. s..

이 포스트에서 사용한 코드는 ES2015의 문법을 다소 사용하고 있으므로 가급적 Node.js v4(LTS) 이상의 버전을 권장한다. Node.js는 대개 MongoDB + Mongoose 조합과 함께 사용하는 경우가 많지만 가끔 RDB의 필요성을 느끼기도 한다. 물론 DB에 연결해서 쿼리를 직접 만들어 날려도 되지만, ORM을 사용하면 수 배 이상의 생산성을 가질 수 있을 것이다. Sequelize.js는 Node.js 기반의 ORM(Object-Releational-Mapping)이다. 공식적으로 PostgreSQL, MySQL, MariaDB, SQLite, MS-SQL을 지원한다. Sequelize.js는 npm으로 다음과 같이 쉽게 설치할 수 있다. 1 npm install sequelize S..