전체 글 (522) 썸네일형 리스트형 Angular Material - Adding Modules (module list) Angular Material is a UI component library provided by Angular. Let's see how to add the module to your angular project.Setting Up the LibraryOpen your project and run the command below (You can also use 'npm install' but 'ng add' automatically completes all the necessary configurations except for adding the module to the module file).ng add @angular/materialThen it will ask if you would like to.. 앵귤러 매터리얼 앵귤러에서 제공하는 UI 컴포넌트인 앵귤러 매터리얼을 추가해 보겠습니다.라이브러리 설치프로젝트를 열고 아래 명령어를 실행합니다. npm으로도 설치 가능하지만 ng add를 통해서 설치하게 되면 모듈에 등록하는 것 빼고 컴포넌트 사용을 위한 모든 구성이 완료되므로 편리합니다.ng add @angular/material실행을 하면 실행 여부를 다시 묻는 데 'yes'를 선택하고 테마선택, 글로벌 폰트 스타일, 애니메이션 등의 사용여부를 결정합니다.모듈에 추가추가된 라이브러리는 모듈에 추가해야 사용이 가능합니다. 정리를 위해 'app.module.ts' 파일에 바로 추가하지 않고 따로 모듈을 생성하여 추가하겠습니다. 아래 커맨드를 실행하여 모듈을 만듭니다.ng g m modules/angular-materia.. Interface Interface is a class that defines attributes without initial values. It makes our life so much easier when we work with TypeScript as we can define a type once and use it across out application. How to Use It? Let's see how we can make the code below simpler using the interface. let object: { name: string; age: number; married?: boolean } = { name: 'tom', age: 20, } Create a interface of the obj.. TypeScript JavaScript, as you know, is a weakly typed language. While this feature allows you to write a code easily and freely, it also make the language prone to logic error whick is very hard to find. TypeScript is a superset of JavaScript. It includes all the features from JavaScript and has an additional feature, yep! you guessed right: type checking which makes it easier to find logic errors early in.. 리액트? 리액트는 자바스크립트 라이브러리로 앵귤러, 뷰와 함께 3대 자바스크립트 프레임워크 중 하나입니다. 앵귤러와 마찬가지로 컴포넌트 단위로 UI를 구성하는 방식을 사용하지만 앵귤러와 달리 상태관리 등의 기능을 자체적으로 탑재하고 있는 것이 아니라 다른 라이브러리를 사용하여 구현하기 때문에 사이즈가 작고 배우기 쉬운 장점이 있습니다.리액트 앱 만들기리액트 앱을 만드는 가장 간단한 방법은 아래 명령어를 사용하는 방법입니다. 커맨드라인을 열고 아래 명령어를 실행하면 필요한 구성과 함께 새로운 리액트 앱이 생성됩니다.npx create-react-app app-name생성된 앱으로 이동하여 편집기를 엽니다.cd app-namecode .구동하기커맨드라인을 열고 아래 명령어 실행npm start참고React – A J.. Web 3 Application Deployment with Cycles Faucet Nothing is free in this world. Running an application on the internet requires sources too. To deploy the Web 3 application we need something called cycles which is like fuel to run the application (canister). There are many ways to get Cycles from buying them with ICP tokens to participate in some kind of survey. But the easiest way, I think, is to get the token from the definite cycles faucet .. Tstory - Smooth rendering When moving to another page or first loading a page, the page seems to pop up suddenly not smoothly link shown in the picture below. So I will show you how to render pages with minimum code that can be used on almost every website. In this example, I will implement the feature on the tstory(Korean blog platform). Completed Code If you want to know the code first here they are. /* Type Selector R.. 티스토리 자연스러운 페이지 로딩 페이지를 이동하면서 요소들이 화면에 표시될 때 요소나 파일이 로딩되는 속도 차이 등의 이유로 아래와 같이 부자연스럽게 표시됩니다. 간단한 작업을 통해 화면을 자연스럽게 로딩하는 효과를 구현해 보겠습니다. 해당 코드는 티스토리의 모든 스킨에 적용가능할 뿐 아니라 거의 모든 웹 사이트에 적용가능합니다. 완성코드 /* Type Selector Reset */ body { /* other styles */ animation: smoothRendering 1s ease forwards; } @keyframes smoothRendering { from {opacity: 0;} to {opacity: 1;} } 구현하기 공통 스타일 추가 관리자 페이지에 보면 좌측에 '스킨편집'이라는 기능이 있는데요. 해당 메뉴를 선.. 이전 1 ··· 37 38 39 40 41 42 43 ··· 66 다음
