Skip to content

Instantly share code, notes, and snippets.

Avatar

VA79 vanaf1979

View GitHub Profile
View h1-h2-p-margins.css
h1,
h2 {
margin: 20px 0 10px 0;
}
p {
margin: 0 0 10px 0;
}
@vanaf1979
vanaf1979 / remove-leading-trailing-margins.css
Created Jun 28, 2020
Remove leading trailing margins with css
View remove-leading-trailing-margins.css
* > :first-child {
margin-top: 0;
}
* > :last-child {
margin-bottom: 0;
}
@vanaf1979
vanaf1979 / add-view-post-overview-column_content.php
Last active Jun 28, 2020
Add content to the WordPress viewpost post overview/list column
View add-view-post-overview-column_content.php
<?php
/**
* add_view_post_overview_column_content.
*
* Add content to the viewpost post overview/list column.
*
* @see https://since1979.dev/___/
* @uses get_permalink() https://developer.wordpress.org/reference/functions/get_permalink/
* @uses get_the_ID() https://developer.wordpress.org/reference/functions/get_the_id/
@vanaf1979
vanaf1979 / add-view-post-overview-column.php
Last active Jun 28, 2020
Add a column to the WordPress posts overview/list.
View add-view-post-overview-column.php
<?php
/**
* add_view_post_overview_column.
*
* Add a column to the posts overview/list.
*
* @see https://since1979.dev/___/
* @uses __() https://developer.wordpress.org/reference/functions/__/
*/
View axios-without-cancel.js
import React, {useState, useEffect} from "react";
import axios from "axios";
const ComponentWithRequest = props => {
const [apiData, setApiData] = useState(null);
useEffect(() => {
View react-bare-component-with-unmount.js
import React, {useEffect} from "react";
const ComponentWithRequest = props => {
useEffect(() => {
props.toggleMounted();
}, [props]);
View react-unmount-component.js
import React, { useState } from "react";
import ComponentWithRequest from "./components/ComponentWithRequest";
const App = () => {
const [mounted, setMounted] = useState(true);
return (
<div className="App">
{mounted && (
View axios-with-cancel.js
import React, {useState, useEffect} from "react";
import axios from "axios";
const ComponentWithRequest = props => {
const [apiData, setApiData] = useState(null);
useEffect(() => {
@vanaf1979
vanaf1979 / js-array-from-example.js
Last active Jun 14, 2020
Use Array.from() to transform Api data to conform to a React component.
View js-array-from-example.js
// MDN Docs: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from
const apiCategories = [
{ id: 0, title: "javascript", description: "...", other: "..." },
{ id: 1, title: "React", description: "...", other: "..." }
];
const transformApiCategories = () => {
return Array.from(apiCategories, category => {
@vanaf1979
vanaf1979 / js-array-filter-example.js
Last active Jun 4, 2020
How to use Array.prototype.filter() to search for objects in an array/api response by object key/value.
View js-array-filter-example.js
// MDN Docs: https://developer.mozilla.org/nl/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
const trekkies = [
{ id: 0, name: "Piccard", planet: "Earth" },
{ id: 1, name: "Spock", planet: "Vulcan" },
{ id: 2, name: "Kirk", planet: "Earth" },
{ id: 3, name: "Worf", planet: "Gault" }
];
You can’t perform that action at this time.