TIL

Yun Subin·2022년 9월 26일
0

BEB_07_RK_NFT

목록 보기
3/10
post-custom-banner

그러니까 생지옥이라고.

문제의 핵심이란 것은 중요하지 않아.
가장 중요한 건 테스터기가 너의 코드를 어떻게 흠 잡을 것인가.
넌 잠을 잘수도 밥을 먹을수도 없게 만드는 건 리액트 문법이 아니라.

tests 폴더의 js 테스츠파일.

으아아아아아아아아아아아아

.
.
그렇게 월요일이 불타버렸다.
오늘 배운 것은 기억나지 않지만 더듬거려 본다면.

음....
진짜 뭐더라
그러니까 뭔가를 연결하고...
.
.
.
.
.
.
아 맞다
.
.
.
.
.
.
리액트 State & Props

부모로 부터 props를 통해 전달된다
시간이 지나도 변하지 않는다
컴포넌트 안의 다른 state나 props를 가지고 계산 가능

하다면 State 아님

딱히 복잡해 보이지 않지만 코드 속에 요 개념이 아른아른 하다면
개념잡기전에는 그 곳에 발 담그지 말길 바래

요넘들 보다도 애를 먹인 녀석들은

<Controlled Component>

요뇸들이다.

예라이 복잡한 것들

그러니까

[A,B] = useState(C)

이렇게 A 랑 B 는 바퀴와 핸들이고
기본 값이 C 라는 거져

전기 선 꼽는다 생각하면 편한데
아까도 말 했지만 코드의 연못에 요 녀석이 아른거린다면.
발 빼시라고.

왜냐하면 요 녀석들 속은


  <div>{A}</div>
      <input
        type="text"
        value={A}
        onChange={(event) => B(event.target.value)}
        placeholder="기본값"
      ></input>
     

요 따구로 꼬여있으니까.

일단 똑바로 보일 때 까지 노려보다가 명확 해 진다 싶으면

[A,B] = useState("C")
  [D,E] = useState("")
   [F,G] = useState(H)

요런 애들이 서로 엉겨붙어서


const Tweets = () => {
  const [ username, setUsername ] = useState('parkhacker'); 
  const [ msg, setMsg ] = useState(''); 
  const [ tweets, setTweets ] = useState(dummyTweets); 

  const handleButtonClick = (event) => {

    const tweet = {
      id: tweets.length + 1,
      username: username,
      picture: 'https://randomuser.me/api/portraits/men/98.jpg',
      content: msg,
      createdAt: new Date().toLocaleDateString('ko-KR'),
      updatedAt: new Date().toLocaleDateString('ko-KR'),
    };
    const newTweets = [tweet, ...tweets];
    setTweets(newTweets); 
  };

  const handleChangeUser = (event) => {
    setUsername(event.target.value)
  };

  const handleChangeMsg = (event) => {
    setMsg(event.target.value)
  };
  };

... 와이리 복잡노

고마 할랍니더. ㅠㅠ

아직 실력 없는 나부랭이지만
코드 쳐서 넣을 수록 일련의 포맷이 생기는 것 같다.
열심히 하다가 두 달 전에 짰던 코드 보면

코드가 웃김

어이가 없을 정도로 무식하게 덕지덕지 발라 놓은 것 같다.
어떤 모지리가 이렇게 짰냐.
.
.
.
.
.
5개월 남았다.
성장하자 모든 코드가 귀여워 질 때 까지.
아직 쫌 무섭다.
.
.
.
.
기존 배열에 새 엘리먼트 넣기

const newArr = [arr, ...arrs]

컴포넌트 리턴

arrs.map(arr=>{
return (<Arr key = {arr.id}
             arr = {arr} />
             )
	   }

.
.
.
.
.
그리고 잘 들어.
코드 무작정 짜지 말고 요구 명세 똑바로 보고 짜라.
그러다가 처음부터 다시 짜는 수가 있다?

오.늘.처.럼

.
.
.

으아아아아아아아아아아앙아아아

(끔찍)

profile
Blockchain Web Developer
post-custom-banner

2개의 댓글

comment-user-thumbnail
2022년 9월 27일

코드,, 귀여워 (대충 insert 귀여워 짤)

1개의 답글