Skip to content

Instantly share code, notes, and snippets.

Avatar
🛰️
Working on a secret mission!

Harsh Makadia Harshmakadia

🛰️
Working on a secret mission!
View GitHub Profile
@Harshmakadia
Harshmakadia / dataMiner.js
Last active Jun 26, 2021
twitter-analytics-data-scraper
View dataMiner.js
// 1. Go to https://analytics.twitter.com/
// 2. Keep scrolling till the end until all the stats data is loaded
// 3. Right click on page click on last option "Inspect" a window should open select console from that
// 4. copy this entire function
function getVal (val) {
val=val.replace(/\,/g,'');
@Harshmakadia
Harshmakadia / oneFunctionUpdater.js
Last active Sep 17, 2020
One function to update multiple input state value
View oneFunctionUpdater.js
import React from "react";
function Form() {
const [state, setState] = React.useState({
firstName: "",
lastName: ""
})
// same function can be used to update multiple values in the state
const handleChange = (evt) => {
View consumeUseCallback.js
const App = () => {
const [state, setState] = useStateCallback(0); // same API as useState + setState with cb
const handleClick = () => {
setState(
prev => prev + 1,
// 2nd argument is callback , `s` is *updated* state
// Hey that state is set successfully what do you
// want to do, I'm callback your friend 😄
s => console.log("I am called after setState, state:", s)
View console.js
// time and time end
console.time("This");
let total = 0;
for (let j = 0; j < 10000; j++) {
total += j
}
console.log("Result", total);
console.timeEnd("This");
// Memory
@Harshmakadia
Harshmakadia / hooks_api_call.jsx
Created Aug 6, 2019
Hooks to make API call in React
View hooks_api_call.jsx
import React, { useState, useEffect } from "react";
import ReactDOM from "react-dom";
import "./styles.css";
function GithubCommit() {
const [page, setPage] = useState(1);
const [commitHistory, setCommitHistory] = useState([]);
const [isLoading, setIsLoading] = useState(true);
@Harshmakadia
Harshmakadia / class_api_call.jsx
Created Aug 6, 2019
Class Component in React for making API calls
View class_api_call.jsx
import React from "react";
import ReactDOM from "react-dom";
import "./styles.css";
class GithubCommit extends React.Component {
constructor() {
super();
this.state = {
commitHistory: [],
View Add update Method.jsx
// Method to addProductToCart
<div>
<button
onClick={context.addProductToCart.bind(this, product)}
>
Add to Cart
</button>
</div>
// Method to removeProductFromCart
View Add_Update Context.jsx
import React, { Component } from 'react';
import ShopContext from './shop-context';
class GlobalState extends Component {
state = {
products: [
{ id: 'p1', title: 'React 16 Sticker + T-shirt', price: 29.99 },
{ id: 'p2', title: 'Vue.js T-shirt', price: 9.99 },
{ id: 'p3', title: 'Angular T-shirt', price: 8.99 },
View static contextType.jsx
import ShopContext from '../context/shop-context'
class CartPage extends Component {
static contextType = ShopContext
componentDidMount() {
// Some advantage of static contextType: We can now also access Context in the rest of the component
console.log(this.context)
}
View Consume Context.jsx
import React, { Component } from 'react';
import ShopContext from '../context/shop-context';
import Navigation from '../components/navigation';
import './product.css';
class ProductsPage extends Component {
render() {
return (
<ShopContext.Consumer>
{context => (