Skip to content

Instantly share code, notes, and snippets.

View newerton's full-sized avatar
🏖️
Working

Newerton newerton

🏖️
Working
View GitHub Profile
@newerton
newerton / Kind.md
Created December 3, 2020 14:08 — forked from franciscojsc/Kind.md
Kind, crie seu cluster Kubernetes localmente com Docker
@newerton
newerton / active-user-list.tsx
Last active September 15, 2022 17:37
Single responsibility principle (SRP)
const ActiveUsersList = () => {
const [users, setUsers] = useState([])
useEffect(() => {
const loadUsers = async () => {
const response = await fetch('/some-api')
const data = await response.json()
setUsers(data)
}
@newerton
newerton / active-users-list-2.tsx
Created September 15, 2022 17:39
Apply Single responsibility principle (SRP)
const useUsers = () => {
const [users, setUsers] = useState([])
useEffect(() => {
const loadUsers = async () => {
const response = await fetch('/some-api')
const data = await response.json()
setUsers(data)
}
@newerton
newerton / active-users-list-3.tsx
Created September 15, 2022 17:43
Apply Single responsibility principle (SRP)
onst UserItem = ({ user }) => {
return (
<li>
<img src={user.avatarUrl} />
<p>{user.fullName}</p>
<small>{user.role}</small>
</li>
)
}
@newerton
newerton / active-users-list-4.tsx
Created September 15, 2022 17:45
Apply Single responsibility principle (SRP)
const getOnlyActive = (users) => {
const weekAgo = new Date()
weekAgo.setDate(weekAgo.getDate() - 7)
return users.filter(user => !user.isBanned && user.lastActivityAt >= weekAgo)
}
const ActiveUsersList = () => {
const { users } = useUsers()
@newerton
newerton / active-users-list-5.tsx
Created September 15, 2022 17:45
Apply Single responsibility principle (SRP)
const useActiveUsers = () => {
const { users } = useUsers()
const activeUsers = useMemo(() => {
return getOnlyActive(users)
}, [users])
return { activeUsers }
}
@newerton
newerton / header.tsx
Created September 15, 2022 17:57
Open-closed principle (OCP)
const Header = () => {
const { pathname } = useRouter()
return (
<header>
<Logo />
<Actions>
{pathname === '/dashboard' && <Link to="/events/new">Create event</Link>}
{pathname === '/' && <Link to="/dashboard">Go to dashboard</Link>}
</Actions>
@newerton
newerton / header-2.tsx
Created September 15, 2022 17:58
Apply Open-closed principle (OCP)
const Header = ({ children }) => (
<header>
<Logo />
<Actions>
{children}
</Actions>
</header>
)
const HomePage = () => (
@newerton
newerton / video-list.tsx
Created September 15, 2022 18:08
Interface segregation principle (ISP)
type Video = {
title: string
duration: number
coverUrl: string
}
type Props = {
items: Array<Video>
}
@newerton
newerton / thumbnail.tsx
Last active September 15, 2022 18:09
Interface segregation principle (ISP)
type Props = {
video: Video
}
const Thumbnail = ({ video }: Props) => {
return <img src={video.coverUrl} />
}