06 2017 档案
摘要:We have modal implement and now we want to implement close functionality. Becuase we use a structure directive to do open modal on click functionality
阅读全文
摘要:We write a function that converts a string to lowercase in WebAssembly, demonstrating how to set the input string from JavaScript. WASM Fiddle: https:
阅读全文
摘要:For example we have two buttons: When we click nether one of those tow button, the modal should show up: We will use structure directive to do that. S
阅读全文
摘要:We are going to have a modal component: And we can pass default modal body by content projection: So 'modal-body' will be shown by default. Now we wan
阅读全文
摘要:We use an offset exporting function to get the address of a string in WebAssembly memory. We then create a typed array on top of the WebAssembly memor
阅读全文
摘要:Using WASM Fiddle, we show how to write a simple number logger function that calls a consoleLog function defined in JavaScript. We then download and r
阅读全文
摘要:We use the C language instead of pure WAST to create a square root function using WASM Fiddle (https://wasdk.github.io/WasmFiddle//). We show how to r
阅读全文
摘要:In this introduction, we show a simple WebAssembly function that returns the square root of a number. To create this function we load up WebAssembly E
阅读全文
摘要:In this lesson we'll use CellMeasurer and CellMeasurerCache to automatically calculate and cache the height of a row. This will allow us to remove the
阅读全文
摘要:In this lesson we'll show how to use the AutoSizer component from react-virtualized to automatically measure the width/height of our content area. We'
阅读全文
摘要:
阅读全文
摘要:Redux is one of the most popular state-management libraries and although not specific to React, it is widely used with it. This is why the author of P
阅读全文
摘要:React-router is the community favourite routing solution - it can handle all of your complex routing needs and in this lesson we’ll cover what’s neede
阅读全文
[Angular] Change component default template (ng-content, ng-template, ngTemplateOutlet, TemplateRef)
摘要:Here is the defulat tab header template: we have set up that we can switch the default template when we pass in another template. Now, what we want is
阅读全文
摘要:Previously we have tab-panel template defined like this: So the template is not overrideable. If we want later able to pass in a different template, w
阅读全文
摘要:When we try to do MongoDB opration, mongoose return Promise, we can use async/await to simply the code: The problme here is no error handling, we can
阅读全文
摘要:Mixin works as a function. Here, we use include keyword to inlcude a mixin file. Exec a mixin function we can use '+': Define a mixin: Here we use som
阅读全文
摘要:Mongoose has some hooks, for example: Before 'save' action, will trigger the function to generate the 'slug' JIT.
阅读全文
摘要:Some applications only need a very minimal routing solution. This lesson will cover a practical example showing the router in use. We’ll build a simpl
阅读全文
摘要:Not every app is greenfield, and it would be a shame if existing React apps could not benefit from the micro-size of Preact. In this lesson we’ll disc
阅读全文
摘要:Storing and updating values inside a component’s local state (known as controlled components) is such a common pattern that Preact offers a really han
阅读全文
摘要:Preact offers, in addition to the regular component API from React, the ability to access both props & state as function parameters to the render meth
阅读全文
摘要:Angular allows us to conveniently use the async pipe to automatically register to RxJS observables and render the result into the template once the re
阅读全文
摘要:By creating a simple ‘hello world’ example application first in vanilla Javascript, and then in Preact without any tools, we’ll learn what type of pro
阅读全文
摘要:In this lesson we'll show how to use React.cloneElement to add additional properties to the children of a React element. We'll also show that you can
阅读全文
摘要:The network may be unreliable and loading data may take time. Thus it is important to give the user some feedback about what's going on as fast as pos
阅读全文
摘要:In this lesson we'll show how to use yarn to alias the names of same npm libraries but install different versions. This could allow for easy migrating
阅读全文
摘要:We can create Template Helpers, which can contains some common reuseable data and libs. Then you can define a locals data in middleware: Require helpe
阅读全文
摘要:If sometime you want to log out the comonent html to see whether the html render correctly, you can do : If you found that some tmeplate binding doesn
阅读全文
摘要:Looking at the follow code: 1. .wapper: div with wrapper class By defualt it consider as div class if you don't wirte div, just give a class name. 2.
阅读全文
摘要:To add alernative theme, we can use :host-context() selector from Angular. So it will apply 'border-color: red' only when host wrapper element has 'au
阅读全文
摘要:For the component's css file, we can improt two css files: common.css default-theme.css In the default theme, it contains all the default theme relate
阅读全文
摘要:In this lesson we'll show how to take a beforeUnload call and convert it to a declarative React Component. It will handle subscribing to events, and a
阅读全文
摘要:In this lesson we'll use cjs-to-es6 to convert CommonJS requires to ES6 imports. We'll also show how to convert over a exported default object to take
阅读全文
摘要:You can easily use TypeStyle to build static html files with encapsulated CSS. You can use this pattern to generate email and pdf template files. Sinc
阅读全文
摘要:You can increase the browser support of your CSS using fallback values and vendor prefixes. This lesson covers using vendor prefixes and fallback valu
阅读全文
摘要:In this lesson we'll use prettier and lint-staged to run prettier only on files that have been changed and committed to git. This will allow you to pr
阅读全文
摘要:TypeStyle tries to be an all in one CSS in JS management solution so you can always fall back to raw CSS if you ever need to migrate old code quickly.
阅读全文
摘要:We cover CSS keyframes and how to create them using TypeStyle. We then show how to use the keyframes function to create an animation. We also discuss
阅读全文
摘要:Install: For example, we can store the sensitive information or env related information in a 'veriables.env' file: Then we can use dotenv to load thos
阅读全文
摘要:We will demonstrate composing classes using the utility classes function. classes is also what we recommend for theming. Using pure CSS classes means
阅读全文
摘要:In this lesson we'll show how to setup a .babelrc file with presets and plugins. Then create npm scripts that use babel-node and babel. With babel-pre
阅读全文
摘要:The API for the store is really simple: There are two methods, set() & select(). Store: interface: Component:
阅读全文
摘要:Just like pseudo-classes, pseudo-elements are added to selectors but instead of describing a special state, they allow you to style certain parts of a
阅读全文
摘要:TypeStyle is a very thin layer on top of CSS. In this lesson we show how to change styles based on pseudo classes e.g. :focus :hover and :active which
阅读全文
摘要:Media queries are very important for designs that you want to work on both mobile and desktop browsers. TypeStyle gives media queries special attentio
阅读全文
摘要:TypeStyle’s style function allows you to give multiple objects as an argument. This provides a simple extensible reuse-ability model. We cover typesty
阅读全文
摘要:TypeStyle is the only current CSS in JS solution that is designed with TypeSafety and TypeScript developer ergonomics in mind. In this lesson we will
阅读全文
摘要:Yellow box warnings in react native can be intrusive. We will use console.disableYellowBox to disable the yellow box entirely. We'll also use console.
阅读全文
摘要:For example you have a component, which take a trasclude input element: There is many ways to get ElementRef of the input, for example using Reference
阅读全文