Skip to content

Instantly share code, notes, and snippets.

@harshaktg
harshaktg / App.js
Created Jun 19, 2021
AWS Amplify App page
View App.js
import "./App.css";
import Home from "./Home";
function App() {
return (
<div className="App">
<header className="App-header">
<Home />
</header>
</div>
@harshaktg
harshaktg / Home.js
Created Jun 19, 2021
AWS Amplify Home page
View Home.js
import Amplify from "aws-amplify";
import awsExports from "./aws-exports";
import { AmplifySignOut, withAuthenticator } from "@aws-amplify/ui-react";
Amplify.configure(awsExports);
const Home = (props) => {
return (
<div>
<AmplifySignOut />
<h1>This is your logged in page.</h1>
@harshaktg
harshaktg / App.js
Created Jun 2, 2021
useAxios - Step 4
View App.js
import useAxios from './useAxios';
const App = () => {
const { response, error, loading } = useAxios({
method: 'POST',
url: '/posts',
headers: {
accept: '*/*',
},
data: {
@harshaktg
harshaktg / useAxios.js
Last active Jun 2, 2021
useAxios - Step 4 custom hook file
View useAxios.js
import { useState, useEffect } from 'react';
import axios from 'axios';
axios.defaults.baseURL = 'https://jsonplaceholder.typicode.com';
const useAxios = (params) => {
const [response, setResponse] = useState(null);
const [error, setError] = useState(null);
const [loading, setLoading] = useState(false);
@harshaktg
harshaktg / App.js
Created Jun 2, 2021
useAxios - Step 3
View App.js
import useAxios from './useAxios';
const App = () => {
const { response, error, loading } = useAxios();
return (
<div className="app">
{loading ? (
<div>Loading...</div>
) : (
<div>
@harshaktg
harshaktg / useAxios.js
Created Jun 2, 2021
useAxios - Step 3 custom hook file
View useAxios.js
import { useState, useEffect } from 'react';
import axios from 'axios';
axios.defaults.baseURL = 'https://jsonplaceholder.typicode.com';
const useAxios = () => {
const [response, setResponse] = useState(null);
const [error, setError] = useState(null);
const [loading, setLoading] = useState(false);
@harshaktg
harshaktg / App.js
Created Jun 2, 2021
useAxios - Step 2
View App.js
import { useState, useEffect } from 'react';
import axios from 'axios';
axios.defaults.baseURL = 'https://jsonplaceholder.typicode.com';
const App = () => {
const [response, setResponse] = useState(null);
const [error, setError] = useState(null);
const [loading, setLoading] = useState(false);
@harshaktg
harshaktg / App.js
Last active Jun 2, 2021
useAxios - Step 1
View App.js
import { useEffect } from 'react';
import axios from 'axios';
axios.defaults.baseURL = 'https://jsonplaceholder.typicode.com';
const App = () => {
const fetchData = async () => {
try {
const res = await axios.get('/posts');
console.log(res.data);
View api.js
export const fetchTodos = () => {
return fetch('https://jsonplaceholder.typicode.com/posts')
.then(response => response.json())
.then(json => json);
}
View webpack.config.js
module.exports = {
optimization: {
splitChunks: { chunks: "all" }
}
};