Frontend 개발자 - hyo.loui

❤️‍🔥TIL : Today I Learned 에러 처리 에러 처리의 필요성 에러는 언제나 발생할 수 있다. 발생한 에러에 대해 대처하지 않고 방치하면 프로그램은 강제 종료된다. 에러 처리의 필요성 console.log('[Start]'); foo(); // ReferceError : foo is not defined // 발생한 에러를 방치하면 프로그램은 강제 종료된다. console.log('[End]'); 위 예시 코드에서 [End] 가 출력되지 않는다. 이러한 현상이 프로젝트에서 발생한다면... 끔찍하다. - try...catch console.log('[Start]'); try { foo(); } catch (error) { console.log('[에러 발생]', error); // [에러 발..

❤️‍🔥TIL : Today I Learned strict mode 모던하게 javscript 코드를 작성하기 위해서는 strict mode(엄격 모드) strict mode란? function callMyName () { me = 'seung hyo'; } callMyName(); console.log(me); // ? 위 코드에서 자바스크립트엔진이 어떻게 동작할까? 1. 선언하지 않은 me 변수에 값 'seung hyo'을 할당했다. 2. js엔진은 me 라는 변수가 어디에 선언 되었는지 스코프 체인을 통해 검색한다. 3. callMyName 함수의 스코프에서 me 변수의 선언을 검색한다. 4. 검색에 실패한다. 5. me 변수를 검색하기 위해 callMyName 함수 컨텍스트의 상위 스코프(전역 스..

🎯목적 : 마이페이지에 구현한 로직과 authentication API 복습, 🤢 오류 해결 : 로그아웃 후 마이페이지, 게시글쓰기 component 이동 시 에러 (useEffect 와 useFocusEffect 에서 발생한 에러 해결) 1. 닉네임 수정 UI 부분에서 삼항연산자로 수정 버튼이 onPress되어 onPressUpdate()함수가 실행이 되면 setState가 되어 onEdit이라는 state는 불리언타입이며 토글(true or false)이 된다! 이후 onEdit의 상태에 따라서 false가 된다면 기존에 있는 닉네임을 감싼 태그가 TextInput으로 바뀌게 되고 수정버튼도 완료버튼으로 바뀌게 된다! 완료버튼이 가진 함수는 onSubmitEdit()으로 updateProfile AP..

🎯목적 : CRUD : Update API 생성 , Firebase : FireStore data 업데이트 🤢 오류 해결 : WARN Possible Unhandled Promise Rejection : TypeError: _n7.indexOf is not a function. 1. setDone (체크아이콘) 체크 아이콘을 누르면 함수가 실행되어 해당하는 todo의 isDone 속성을 토글로 변경하고, isDone이 true 라면 완료했다는 효과(text-decoration: line-through)를 주자 아이콘 클릭 시 실행되는 함수이고, 서버통신을 하는 부분이니 비동기 처리를 해줬다. 또 현재 가지고 있는 todos의 isDone을 토글해야 했기 때문에 find 라는 변수로 지금 가진 isDone..

🎯목적 : 리액트 네이티브 프로젝트를 생성하고 expo 패키지를 활용하여 쉬운 셋업 및 빠른 초기개발을 해보자! 🤢 오류 해결 : expo request time out CommandError: ngrok tunnel took too long to connect. 1. expo 계정에서 project 생성 . https://expo.dev/ Expo Expo is an open-source platform for making universal native apps for Android, iOS, and the web with JavaScript and React. expo.dev 위 사이트에서 계정을 만들어야 한다 계정을 생성했다면, Create a project 에서 프로젝트를 생성하면 아래로 넘어간다..

🤢에러 내용 : Uncaught TypeError: Cannot read properties of undefined (reading 'pathname') 콘솔에 이러한 에러가 발생했다 솔루션 1 (reading 'pathname') 이 출력되어 내가 pathname 설정 했었나? 하고 프로젝트 폴더에서 검색했는데 나오지 않았다.. 솔루션 2 (reading 'pathname') 밑으로 at Router 가 출력되어 Router 컴포넌트를 찾아보기로 했다. path 를 pathname 으로 변경 해보았고 다시 Routes 와 Route 구문도 구글링하여 다시 작성했으나 효과가 없었다.. 그러던 중 export default 가 되고 있으니 import 를 따라가 보자고 생각했고 그 결과, 에러의 원인을 찾..

에러 내용 VM21:1 Warning: Cannot update a component (`App`) while rendering a different component (`TodoList`). To locate the bad setState() call inside `TodoList`, follow the stack trace as described in https://reactjs.org/link/setstate-in-render at TodoList (http://localhost:3000/static/js/bundle.js:413:5) at div at App (http://localhost:3000/static/js/bundle.js:38:76) 에러 이유 : 컴포넌트에서 호출하고 있는 setSt..

더보기 ❤️‍🔥TIL : Today I Learned try...catch 개발을 하다보면 누구나 에러를 만나고, 또 누구라도 에러가 생기기 마련이다. 이러한 에러로 인해 다른 구문이 실행이 안되는 상황이생겨, 렌더링을 마무리하지 못하게 된다. if/else 문을 통해 예외 처리를 할 수 있지만 모든 개발자가 수많은 에러를 예측하기 쉽지는 않다. 그래서 우리는 try...catch 를 통해 코드가 중단되는 것을 방지하고 에러의 예외처리를 해놓는다면, 더 안정적인 코드를 작성할 수 있다 try(시도) 하여 에러가 발생하면 try(잡는) 문법 이다. try{ //실행될 코드 } catch (error) { //에러 발생 시 실행할 코드 } 그래서 if/else 를 사용하는 것 처럼 try 와 catch 라는..