Bewar Salah bewarusman

🎯

Focusing

bewarusman / redo-undo.html

Last active August 15, 2023 12:53

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<title>Online Text Editor</title>
	<link
	rel="stylesheet"
	href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
	/>

bewarusman / updating_simple_recoil_atom.js

Last active September 29, 2021 13:43

	import { useState } from 'react';
	import { useRecoilState } from "recoil";

	function CreateUser() {
	const [, setUsers] = useRecoilState(usersState);
	const [name, setName] = useState('');

	function handleSubmit(e) {
	e.preventDefault();
	setUsers(users => setUsers([...users, {

bewarusman / recoil_root_demo.js

Last active September 29, 2021 13:45

	import { RecoilRoot } from "recoil";

	function App() {
	return (
	<RecoilRoot>
	<CreateUser />
	<UsersList />
	</RecoilRoot>
	);
	}

bewarusman / using_simple_recoil_atom.js

Last active September 29, 2021 13:31

	import { useRecoilValue } from "recoil";

	function UsersList() {
	const users = useRecoilValue(usersState);

	return (
	<ul>

	{users.map((user) => (
	<li key={user.id}>{user.name}</li>

bewarusman / simple_recoil_atom.js

Created September 29, 2021 13:04

bewarusman / recoil_vs_redux_redux.js

Created September 29, 2021 13:03

	import { createStore, applyMiddleware } from "redux";
	import thunk from "redux-thunk";
	import { Provider, connect } from "react-redux";

	const initialState = {
	users: [],
	loading: false
	};

	const actionTypes = {

bewarusman / recoil_vs_redux_recoil.js

Created September 29, 2021 12:41

	import { RecoilRoot, atom, useRecoilState, useRecoilValue } from "recoil";

	const usersState = atom({
	key: "usersState",
	default: []
	});

	const loadingState = atom({
	key: "loadingState",
	default: false

bewarusman / class_component.js

Created January 9, 2021 06:31

	import React from "react";
	import DataTable from "./components/DataTable";

	class App extends React.Component {
	state = {
	todos: [],
	};

	componentDidMount() {
	fetch("https://jsonplaceholder.typicode.com/todos")

bewarusman / render.js

Created January 9, 2021 06:19

bewarusman / component_did_update.jsx

Created January 9, 2021 06:10

	componentDidUpdate(prevProps) {
	if (prevProps.children !== this.props.children) {
	// update third-party library based on prop change
	}
	}