[DEV] App Dev ∕ Web Front 검색 결과
69 개의 검색 결과가 있습니다.

[React] rc-tree 라이브러리를 통한 treeview 공통 컴포넌트 만들기

보호되어 있는 글입니다.

2023. 5. 9. 16:41
[DEV] App Dev ∕ Web Front/Framework ∕ Angular

[Angular] 코딩 스타일 가이드

개요 이 페이지는 Angular 프로젝트에서 가독성을 높이기 위해 권고하는 코딩 스타일 가이드에 대한 학습 자료를 정리하였습니다. Angular 팀에서 제안하는 코딩 스타일 가이드 공식 사이트에서 크게 기억에 남는 부분만 발췌한 것으로, 더 자세한 내용은 아래 출처 페이지를 참고하시기 바랍니다. 단일 책임 원칙 모든 컴포넌트와 서비스, 심볼은 단일 책임 원칙(single responsibility principle, SRP)을 준수하며 작성하세요. 그러면 애플리케이션이 좀 더 깔끔해지고 유지보수하기도 편하며, 테스트하기도 편해집니다. 한 파일에는 400줄 이하의 코드만 작성하는 것을 권장합니다. 하나의 컴포넌트에서 모두 정의하지 말고, .component / .model / .service 등으로 나누어..

2022. 12. 14. 21:46
[DEV] App Dev ∕ Web Front/Extension ∕ Chrome extension

[Chrome Extension] CSP 설정

Extension의 CSP 설정 XSS 공격을 막기 위해서 크롬 익스텐션은 Content Security Policy (이하 CSP)라는 보안 정책을 갖고 있다. 익스텐션에서 로드되거나 실행되는 컨텐츠의 범위를 제한하는 방법으로 동작하며, 블랙리스트 방식과 화이트리스트 방식을 모두 적용할 수 있다. 크롬 익스텐션엔 기본적으로 크롬 API와 호스트 등을 제한하는 Permissions 정책이 있긴 하지만, CSP는 이보다 더 상위에, 별도로 존재하는 보안 정책이다. `unsafe-eval`을 추가하는 방법으로 허용할 수 있다. 아래와 같이 정의하면 된다. - 기본값일 경우 (eval, inline js, 외부 스크립트 import 불가) "content_security_policy": script-src '..

2022. 11. 30. 13:40
[DEV] App Dev ∕ Web Front/Lang ∕ Css, Scss, Less

[CSS] 개발 참고자료 목록

개요 이 페이지는 Css로 앱/웹 UI를 디자인 시, 검색하여 참고한 사이트 및 정보를 정리해놓았습니다. 참고자료 목록 CSS 일반 div 태그 위에 div 태그를 그리는 방법 .container { background-color:aqua; /* flex-grow를 통해, div처럼 사용하기 위해 flex 사용 */ display: flex; /* 100% 넘어가면 다음으로 넘겨짐 (불필요) */ flex-wrap: wrap; /* 수직 가운데 정렬 */ align-items: center; /* div와 div를 겹치려면 parent에 position: relative를 지정 (핵심) */ position:relative; height:50px; margin-bottom: 10px; } .child1 ..

2022. 10. 27. 23:38
[DEV] App Dev ∕ Web Front/Framework ∕ React

[React] 개발 참고자료 목록

개요 이 페이지는 React 프로젝트로 앱/웹을 구현하면서, 검색하여 참고한 사이트 및 정보를 정리해놓았습니다. 참고자료 목록 React 일반 useEffect와 useLayoutEffect의 차이점은 무엇인가? https://medium.com/@jnso5072/react-useeffect-와-uselayouteffect-의-차이는-무엇일까-e1a13adf1cd5 [React] useEffect 와 useLayoutEffect 의 차이는 무엇일까? React 가 웹 프레임워크 시장에서 대세가 되면서, 많은 사람들이 웹 어플리케이션을 제작하기 위해 React 를 사용하고 있습니다. 특히, 2018년 10월의 React Conf 에서 발표된 React Hooks 가 등장함에 따라 medium.com Sus..

2022. 10. 23. 21:24
[DEV] App Dev ∕ Web Front/Framework ∕ Angular

[Angular] 개발 참고자료 목록

개요 이 페이지는 Angular 프로젝트로 앱/웹을 구현하면서, 검색하여 참고한 사이트 및 정보를 정리해놓았습니다. 참고자료 목록 Angular 일반 Angular Pipe 구현 시, 비동기 함수를 사용하는 방법 import { ChangeDetectorRef, Pipe, PipeTransform } from "@angular/core"; import { SettingService } from "src/app/services/setting/setting.service"; import { SETTING_KEY } from "src/app/models/enums/setting.enum"; import DateTimeUtils from "src/app/utils/datetime.util"; @Pipe({ na..

2022. 10. 23. 21:00