please's Introduction
please's People
please's Issues
μ μ λλ€μ κΈΈμ΄μ λ°λ₯Έ UI λ¬Έμ
μ¬μ©μ μν λ λλ§ (μλ‘ κ³ μΉ¨ μμ΄ μνκ° μλ°λλ νμ)
μ΄μκ°μ
- μ¬μ©μ μν λλλ§(μ μ λ€μ)μ΄ λ‘κ·ΈμΈμ λ³κ²½λμ΄μΌ νλλ°, λ‘κ·ΈμΈ νμλ λ³κ²½λμ§ μλ νμ
μμΈλ΄μ©
- λ‘컬μ€ν 리μ§μ μ μ₯λ usenameμ μ΄μ©ν΄ μ¬μ©μ μνμ μ μ λ€μμ λ³κ²½ν΄ μ€λλ€.
- μλ μ½λμ κ°μ΄ λ‘컬μ€λ‘리μ§μ λ°μ΄ν°λ₯Ό λΆλ¬μ€κ³ λ λ€ setIsLoggedIn(true)λ‘ λ³κ²½ν΄μ£Όμ΄ μ¬μ©μ μν λ λλ§μ λ³κ²½ν΄μ£Όλ λ‘μ§μ λλ€.
useEffect(() => {
const storedResponse = localStorage.getItem('response');
if (storedResponse) {
const parsedResponse = JSON.parse(storedResponse);
const username = parsedResponse.user.username;
setUser({ userName: username });
setIsLoggedIn(true);
}
console.log(storedResponse);
}, []);
{isLoggedIn ? (
<>
<Link to={`/mypage`}>{user?.userName}λ</Link>
<Link to="#" onClick={handleLogout}>
λ‘κ·Έμμ
</Link>
</>
) : (
<>
<Link to={`/login`}>λ‘κ·ΈμΈ</Link>
<Link to={`/signup`}>νμκ°μ
</Link>
</>
)}
κ·Έλ¬λ λ‘κ·ΈμΈ λ€μλ μν λ³κ²½μ΄ μΌμ΄λμ§ μμ΅λλ€.
μλ‘κ³ μΉ¨μ ν΄μΌλ§
λ‘ λ³κ²½λλ μ΄μκ° λ°μνμ΅λλ€.
νλ‘μ νΈ νΌλλ°± - μμ±μ: λ₯μ μ² νν°
Overview
- μ¬λΆλ¦ μλΉμ€λ₯Ό μΌμ€μκ² μ ꡬννμ ¨μ΅λλ€.
- 리λλ―Έ API Tableμ API_URLμ κΌ κΈ°μ λλ©΄ μ’κ² μ΅λλ€.
- νλ‘μ νΈ λ¬Έμμμ μ¬μ©κΈ°μ μ κ°λ₯νλ©΄ κΈ°μ μ€ν κ³ μ μ μμ΄μ½ ν¬ν¨ν΄μ μμ±ν΄ μ£Όμλ©΄ λ μ’μ΅λλ€.
- μ’μμμ optimistic updates μ μ©νμ ¨λλ°, onErrorκ³Ό onSettledκ° μλ€μ. μλ¬κ° λ°μνμλμ μμΈμ²λ¦¬κΉμ§ μ κ²½μ¨μ£Όμλ©΄ λ μ’μ΅λλ€. λΏλ§ μλλΌ μ’μμλ₯Ό μ°μμΌλ‘ ν΄λ¦νλ μ¬μ©μλ₯Ό λλΉν΄μ λλ°μ΄μ±κΉμ§ μ μ©ν΄λ³΄λ©΄ λ μ’κ² μ΅λλ€.
- PR 리뷰λ λ¦¬λ·°μ΄ μ§μ ν΄μ νλ°νκ² μ μ§ννμ ¨μ΅λλ€.
- νμκ°μ μ νμκ°μ λ²νΌ ν΄λ¦ μ μ βμ΄λ―Έ μ‘΄μ¬νλ μ΄λ©μΌβμΈμ§ μμλ³Ό μ μλλ‘ APIμμ²νλ λ‘μ§μ λ£μΌμ ¨λλ°, μ΄λ©μΌ νμ 쑰건μ λ§μ‘±μν€λ©΄ νμ΄νν λλ§λ€ μμ²μ΄ κ°κΈ° λλ¬Έμ λ³λλ‘ μ€λ³΅ νμΈ λ²νΌμ λ°λ‘ λ§λ€κ±°λ, μ΄λλ‘ μ§ννκ³ μΆμΌμλ©΄ λλ°μ΄μ±μ μ μ©νμλ©΄ λ μ’κ² μ΅λλ€.
- λΆν λ΄μ© μμ± μ μ§λ ν΄λ¦λ³΄λ€λ μ’λ μ νν μ£Όμμ λ ₯μ μν΄μ μ€μ μ£Όμ APIλ₯Ό ν΅ν΄μ μ£Όμμ λ ₯μ νλ©΄ λ μ’μ κ² κ°μ΅λλ€.
- 무νμ€ν¬λ‘€ κΈ°λ₯ useInfiniteQueryλ‘ μ ꡬνν΄μ£Όμ ¨μ΅λλ€.
- μ κ³ νκΈ° κΈ°λ₯μ΄ μλλ°, κ΄λ¦¬μ νμ΄μ§λ λ°λ‘ μμΌλ©΄ μ’κ² μ΅λλ€.
- json-server-auth νμ©νμ μ jwtμ μ΄μ©ν μΈμ¦μΈκ° μ²λ¦¬ μν΄μ£Όμ ¨μ΅λλ€.
- νμ μ€ν¬λ¦½νΈ μ¬μ©μ΄μ : μ»΄νμΌνκΈ°μ μ νμ μλ¬λ₯Ό μ‘μμ£Όλ κ² μλλΌ λ°νμμ μ νμ μλ¬λ₯Ό μ‘μμ€λλ€.
- λ‘κ·ΈμΈλ²νΌ λΉνμ±ν λ‘μ§ μ’μ΅λλ€.
- νλ‘μ νΈ κ΄λ¦¬ μ λ§ μ€μν©λλ€. νμ₯λμ΄ λ§€ νμλ§λ€ κ° κΈ°λ₯μ λ§κ°κΈ°ν λ° μ 체 μ§λμ¨μ 체ν¬ν΄μ£Όμ μΌ ν©λλ€.
404 page( path='/*'), footer & header μ¨κΈ°κΈ°
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.