Skip to content

Instantly share code, notes, and snippets.

Avatar

Nicolas Santos nsantos16

View GitHub Profile
View Breadcrumb.js
import React, { useState, useEffect, useContext, useRef } from "react";
import ReactDOM from "react-dom";
import { NavLink } from "react-router-dom";
import styled from "styled-components";
import "./styles.css";
const Context = React.createContext();
const useBreadcrumbContext = () => {
const context = useContext(Context);
View axe-setup.js
import React from 'react';
import ReactDOM from 'react-dom';
// Disable in production
if (process.env.NODE_ENV !== 'production') {
var axe = require('react-axe');
axe(React, ReactDOM, 1000);
View component-page-title.js
import React from 'react';
import ReactDOM from 'react-dom';
// Disable in production
if (process.env.NODE_ENV !== 'production') {
var axe = require('react-axe');
axe(React, ReactDOM, 1000);
View component-page-title.js
import React from 'react';
import usePageTitle from 'hooks/usePageTitle';
const ListPage = ({ items = [] }) => {
usePageTitle('List of items');
return (
<div className="list-component">
<ListTitle title="List component" />
View use-page-title.js
import React from 'react';
const usePageTitle = title => {
useEffect(() => {
document.title = title;
}, [document]);
};
export default usePageTitle;
View example-accessibility-2.html
<div class="list-component">
<div class="list-title">
<span>List component</span>
</div>
<div class="list-component-items">
<span>List item 1</span>
<span>List item 2</span>
</div>
</div>;
View example-accessibility-2.js
import React, { Fragment } from 'react';
const ListItem = ({ item }) => (
<Fragment>
<span>{item}</span>
</Fragment>
);
// Try to avoid index as key's
View example-accessibility.html
<div class="list-component">
<div class="list-title">
<span>List component</span>
</div>
<div class="list-component-items">
<div>
<span>List item 1</span>
</div>
View example-accessibility.jsx
import React from 'react';
const ListItem = ({ item }) => (
<div>
<span>{item}</span>
</div>
);
const List = ({ items = [] }) => (
<div className="list-component">
View react-query-basic-demo-mutation.js
const { status, data, error } = useQuery('movies', fetchTodoList);