Skip to content

Instantly share code, notes, and snippets.

View abdelfattah-atef94's full-sized avatar

Abdelfattah atef abdelfattah-atef94

1 follower · 0 following
  • Dubai
View GitHub Profile
@abdelfattah-atef94
abdelfattah-atef94 / controlledComponent.js
Created March 31, 2020 11:12
import React, { useState } from "react";
export default function App() {
const [inputValue, setInputValue] = useState("");
const handleInputChange = (e) => {
setInputValue(e.target.value)
}
const handleSubmitButton = () => {
alert(inputValue);
};
@abdelfattah-atef94
abdelfattah-atef94 / controlledComponent.js
Created March 31, 2020 10:57
import React, { useState } from "react";
export default function App() {
const [inputValue, setInputValue] = useState("");
const handleSubmitButton = () => {
alert(inputValue);
};
return (
<div className="App">
<input value={inputValue} onChange={e => setInputValue(e.target.value)} />
@abdelfattah-atef94
abdelfattah-atef94 / controlledComponent.js
Created March 31, 2020 10:52
import React, { useState } from "react";
export default function App() {
const [inputValue, setInputValue] = useState("");
const handleSubmitButton = () => {
alert(inputValue);
};
return (
<div className="App">
<input value={inputValue} onChange={e => setInputValue(e.target.value)} />
@abdelfattah-atef94
abdelfattah-atef94 / controlledComponent.js
Created March 31, 2020 10:40
import React, { useState } from "react";
export default function App() {
const [inputValue, setInputValue] = useState("");
return (
<div className="App">
<input value={inputValue} onChange={e => setInputValue(e.target.value)} />
</div>
);
}
@abdelfattah-atef94
abdelfattah-atef94 / uncontrolledComponent.js
Created March 31, 2020 10:39
import React, { useRef } from "react";
export default function App() {
const inputRef = useRef(null);
const handleSubmitButton = () => {
alert(inputRef.current.value);
};
return (
<div className="App">
<input type="text" ref={inputRef} />
@abdelfattah-atef94
abdelfattah-atef94 / gist:0074b39feec94a8724786dd28f7c55b5
Created March 31, 2020 10:39
uncontrolled component example
import React, { useRef } from "react";
export default function App() {
const inputRef = useRef(null);
const handleSubmitButton = () => {
alert(inputRef.current.value);
};
return (
<div className="App">
<input type="text" ref={inputRef} />
@abdelfattah-atef94
abdelfattah-atef94 / gist:4b6d0f1cba25af419b5b535e3489bf0d
Created March 31, 2020 10:38
import React, { useRef } from "react";
export default function App() {
const inputRef = useRef(null);
const handleSubmitButton = () => {
alert(inputRef.current.value);
};
return (
<div className="App">
<input type="text" ref={inputRef} />
@abdelfattah-atef94
abdelfattah-atef94 / gist:c24016046adb572413da69c73d5be6df
Created March 31, 2020 10:34
import React, { useState } from "react";
export default function App() {
const [inputValue, setInputValue] = useState("");
return (
<div className="App">
<input type="text" value={inputValue} onChange={e => setInputValue(e.target.value)} />
</div>
);
}
@abdelfattah-atef94
abdelfattah-atef94 / gist:3fd910daf8d1310ceb6cfedb4dab13dc
Created March 31, 2020 10:27
import React, { useState } from "react";
export default function App() {
const [inputValue, setInputValue] = useState("");
return (
<div className="App">
<input value={inputValue} onChange={e => setInputValue(e.target.value)} />
</div>
);
}
@abdelfattah-atef94
abdelfattah-atef94 / manifest.json
Created November 28, 2019 08:54
{
"name": "Users App",
"short_name": "Users",
"description": "PWA users app",
"theme_color": "#2196f3",
"background_color": "#2196f3",
"display": "standalone",
"start_url": "/build/index.html",
"icons": [
{