Skip to content

Instantly share code, notes, and snippets.

View dinhducit's full-sized avatar

duc dinhducit

  • Ho Chi Minh, Viet Nam
View GitHub Profile
@dinhducit
dinhducit / embedded-file-viewer.md
Created March 29, 2023 17:25 — forked from tzmartin/embedded-file-viewer.md
Embedded File Viewer: Google Drive, OneDrive

Office Web Apps Viewer

('.ppt' '.pptx' '.doc', '.docx', '.xls', '.xlsx')

http://view.officeapps.live.com/op/view.aspx?src=[OFFICE_FILE_URL]

<iframe src='https://view.officeapps.live.com/op/embed.aspx?src=[OFFICE_FILE_URL]' width='px' height='px' frameborder='0'>
</iframe>

OneDrive Embed Links

@dinhducit
dinhducit / angular-expression-changed.md
Created March 6, 2023 14:46 — forked from vades/angular-expression-changed.md
Fixing "Expression has changed after it was checked" in Angular

Fixing "Expression has changed after it was checked" in Angular

The exception appears (in the development mode) at the moment the value is checked and value is different of the updated value.

Error message example

AppComponent.html:1 ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'ngIf: true'. Current value: 'ngIf: false'.
    at viewDebugError (core.js:20440)
    at expressionChangedAfterItHasBeenCheckedError (core.js:20428)
    at checkBindingNoChanges (core.js:20530)
@dinhducit
dinhducit / README.md
Created January 5, 2023 02:14 — forked from mayank23/README.md
Jest Mock Any Property on Window Utility - with automatic cleanup

Jest Mock Any Property on Window Utility - with automatic cleanup.

@dinhducit
dinhducit / angular-lint.md
Created December 19, 2022 16:38 — forked from duc-codehq/angular-lint.md
Angular ESLint with Prettier, AirBnB Styleguide, Husky and lint-staged configuration

Install Angular ESLint

ng add @angular-eslint/schematics

To lint Jasmine spec files, install appropriate npm-package

npm i eslint-plugin-jasmine -D

And add a new block of rules in overrides for files with *.spec.ts extension:

"overrides": [
  ...,
@dinhducit
dinhducit / angular-cli-node-js-typescript-rxjs-compatiblity-matrix.csv
Created December 19, 2022 14:58 — forked from LayZeeDK/angular-cli-node-js-typescript-rxjs-compatiblity-matrix.csv
Angular CLI, Angular, Node.js, TypeScript, and RxJS version compatibility matrix. Based on changelogs, metadata, and hands-on experience. Major Node.js and RxJS versions above officially supported versions are not listed. Note that both major and minor TypeScript versions contain breaking changes.
Angular CLI version Angular version Node.js version TypeScript version RxJS version
1.0.0-beta.17 (package name: angular-cli) ~2.0.2 ^6.9.5 ~2.0.10 ^5.0.3
1.0.0-beta.20-1 (package name: angular-cli) ~2.1.2 ^6.9.5 ~2.0.10 ^5.0.3
1.0.0-beta.22-1 (package name: angular-cli) ~2.2.4 ^6.9.5 ~2.0.10 ^5.0.3
1.0.0-beta.30 ~2.3.1 ^6.9.5 ~2.0.10 ^5.0.3
1.0.0-rc.4 ~2.4.10 ^6.9.5 ~2.0.10 ^5.0.3
~1.0.6 >= 4.0.3 <= 4.1.3 ^6.9.5 ~2.2.2 ^5.0.3
~1.1.3 >= 4.0.3 <= 4.1.3 ^6.9.5 ~2.3.4 ^5.0.3
~1.2.7 >= 4.0.3 <= 4.1.3 ^6.9.5 ~2.3.4 ^5.0.3
~1.3.2 >= 4.2.6 <= 4.4.7 ^6.9.5 ~2.4.2 ^5.0.3
@dinhducit
dinhducit / clean_code.md
Created July 19, 2022 07:14 — forked from wojteklu/clean_code.md
Summary of 'Clean code' by Robert C. Martin

Code is clean if it can be understood easily – by everyone on the team. Clean code can be read and enhanced by a developer other than its original author. With understandability comes readability, changeability, extensibility and maintainability.


General rules

  1. Follow standard conventions.
  2. Keep it simple stupid. Simpler is always better. Reduce complexity as much as possible.
  3. Boy scout rule. Leave the campground cleaner than you found it.
  4. Always find root cause. Always look for the root cause of a problem.

Design rules

@dinhducit
dinhducit / CreateBrowser.js
Created October 16, 2020 17:19 — forked from smartdev10/CreateBrowser.js
puppeteer-extra exemple
const puppeteer = require('puppeteer-extra');
const StealthPlugin = require('puppeteer-extra-plugin-stealth');
const AdblockerPlugin = require('puppeteer-extra-plugin-adblocker');
(async() => {
puppeteer.use(AdblockerPlugin({ blockTrackers: true }));
puppeteer.use(StealthPlugin());
puppeteer.use(require('puppeteer-extra-plugin-anonymize-ua')())
puppeteer.use(require('puppeteer-extra-plugin-user-preferences')({userPrefs: {
@dinhducit
dinhducit / force-scrollbars-visible.css
Created September 16, 2020 11:13 — forked from IceCreamYou/force-scrollbars-visible.css
Mac OS X hides scrollbars by default. This is annoying for UI design because it means users might not realize that certain areas are scrollable. This public domain Gist forces the scrollbar to always be visible with native behavior in Webkit-based browsers (Chrome and Opera) on Macs.
.force-show-scrollbars ::-webkit-scrollbar-track:vertical {
border-left: 1px solid #E7E7E7;
box-shadow: 1px 0 1px 0 #F6F6F6 inset, -1px 0 1px 0 #F6F6F6 inset;
}
.force-show-scrollbars ::-webkit-scrollbar-track:horizontal {
border-top: 1px solid #E7E7E7;
box-shadow: 0 1px 1px 0 #F6F6F6 inset, 0 -1px 1px 0 #F6F6F6 inset;
}
@dinhducit
dinhducit / README.md
Created August 13, 2020 15:07 — forked from johanlef/README.md
Use CSS custom properties (--var) with bootstrap SCSS

The file _functions-override.scss contains the custom functions to handle color conversions within sass and bootstrap.

Bootstrap does not like its sass variables set to css custom properties, e.g. var(--primary). If you use the code snippets below, you can do so, under some conditions.

In the most basic case, you should provide your color variables using the hsl format.

If you insert this using javascript, you can use the script apply-colors.jsx to let js handle the conversion from hex or rgb to hsl.

Reference the main.scss file to import the files in the correct order.