Skip to content

Instantly share code, notes, and snippets.

View xelinel32's full-sized avatar
🚤

Artem Sedliar xelinel32

🚤
View GitHub Profile
@xelinel32
xelinel32 / .eslintrc.js
Created February 1, 2024 17:00 — forked from onlime/.eslintrc.js
ESLint/Prettier config for Vue 3 in VS Code
module.exports = {
root: true,
env: {
browser: true,
node: true,
},
extends: [
'eslint:recommended',
'plugin:vue/vue3-recommended',
'prettier'
@xelinel32
xelinel32 / group-objects-by-property.md
Created November 9, 2021 11:28 — forked from mikaello/group-objects-by-property.md
Group Array of JavaScript Objects by Key or Property Value

Group array of JavaScript objects by keys

This fork of JamieMason's implementation changes the key parameter to be an array of keys instead of just a single key. This makes it possible to group by multiple properties instead of just one.

Implementation

const groupBy = keys => array =>
  array.reduce((objectsByKeyValue, obj) => {
    const value = keys.map(key => obj[key]).join('-');
@xelinel32
xelinel32 / deploy.yml
Created May 5, 2021 10:35
GitHub Deploy & Actions
name: Deploy
on:
push:
branches:
- master
jobs:
deploy:
runs-on: ubuntu-latest
@xelinel32
xelinel32 / github_gpg_key.md
Created April 6, 2021 18:51 — forked from ankurk91/github_gpg_key.md
Github : Signing commits using GPG (Ubuntu/Mac)

Github : Signing commits using GPG (Ubuntu/Mac) 🔐

  • Do you have an Github account ? If not create one.
  • Install required tools
  • Latest Git Client
  • gpg tools
# Ubuntu
sudo apt-get install gpa seahorse
# MacOS with https://brew.sh/
@xelinel32
xelinel32 / what-forces-layout.md
Created April 6, 2021 18:45 — forked from paulirish/what-forces-layout.md
What forces layout/reflow. The comprehensive list.

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
@xelinel32
xelinel32 / workaround.css
Created April 5, 2021 19:04 — forked from mrtcmn/workaround.css
firefox backdrop-filter workaround
@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
.blurred-container {
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
}
}
/* slightly transparent fallback for Firefox (not supporting backdrop-filter) */
@supports not ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
.blurred-container {
@xelinel32
xelinel32 / Api.js
Last active September 14, 2021 18:53
Axios config from Vue
import axios from 'axios'
export default () => {
const axiosInstance = axios.create({
baseURL: `${process.env.VUE_APP_URL}/api/v1`,
})
const token = localStorage.getItem('token')
if (token) {
axiosInstance.defaults.headers.common.Authorization = `Bearer ${token}`