Skip to content

Instantly share code, notes, and snippets.

Avatar

Alex Ilyaev alexilyaev

View GitHub Profile
@alexilyaev
alexilyaev / time-to-decimal.js
Created Dec 6, 2018
Alfred Worflow - Time To Decimal
View time-to-decimal.js
/**
* Convert a time string to a decimal value
*
* @param {string} argv e.g. 142h13m, 142 h 13 min
*/
function run(argv) {
const query = argv[0];
const [, hours, minutes] = query.match(/\s*(?:(\d+)\s*h)?\s*(?:(\d+)\s*m)?/)
let decimal = 0;
@alexilyaev
alexilyaev / Next.js-9.3.md
Last active May 11, 2020
Summary of the new stuff in Next.js 9.3
View Next.js-9.3.md

The blog post on Next.js 9.3

export async getStaticProps

  • Runs at build time only, meaning if there’s no getInitialProps, the page will be served as a static file (no SSR).
  • Can pass data to the page component as props.
  • In development runs on every request

export async getStaticPaths

@alexilyaev
alexilyaev / deploy-ci.sh
Last active May 19, 2020
Git CI authentication with SSH keys
View deploy-ci.sh
#!/usr/bin/env bash
# References:
# https://docs.travis-ci.com/user/environment-variables
#
# Inspired by:
# https://gist.github.com/willprice/e07efd73fb7f13f917ea
# But using SSH keys instead of Personal Access Token:
# https://gist.github.com/alexilyaev/2672fe6d99756377fbffaabad6db1f45
@alexilyaev
alexilyaev / date-fns-issues.md
Last active Sep 25, 2020
What to do now that Moment.js is considered a legacy project?
View date-fns-issues.md
View prettier-config.md

trailingComma: es5 (default)

https://prettier.io/docs/en/options.html#trailing-commas

When set to none...

  • Often forgetting to add a comma when adding entries to an Object.
  • Commenting a property in an object currently removes the comma from the property above it.
  • Moving the last property of an object up requires an extra step to add a comma at the end.
  • Messes up Git diff and sometimes creates conflicts.
@alexilyaev
alexilyaev / css-guidelines.md
Created Dec 10, 2020
CSS Styling Guidelines
View css-guidelines.md

CSS Styling Guidelines

  • Use rem units for font-size and line-height.
    • The user preferences are respected.
    • We can change the apparent px value of rem to whatever we'd like.
  • Use px, % or vw for layout purposes.
    • For example, when using margin, padding, width, height, etc.
    • Easier to implement design requirements.
    • Why not rem here as well?
      • Layout can break when changing the base browser font-size.
View typescript-guidelines.md

Style Guides

Guidelines

  • Avoid using any as much as possible.
    • If you want a type meaning "any object", use Record<string, unknown> instead.
    • If you want a type meaning "any value", you probably want unknown instead.
@alexilyaev
alexilyaev / react-folder-structure-ideas.md
Last active Dec 10, 2020
React Folder Structure Ideas
View react-folder-structure-ideas.md

React Folder Structure Ideas

Suggested structure

components/
  NavBar/
    BrandLogo.jsx
    NavBar.jsx
    NavBar.text.jsx
@alexilyaev
alexilyaev / settings.json
Last active Jan 5, 2021
VS Code Common Settings
View settings.json
{
"[html]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[javascriptreact]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},