# Routes
[Flutter GetX] GetX를 사용한BottomNavigation Bar의 Routes 이동에 관하여
앱에 대한 간단한 정보 상태관리 : GetX 사용중 앱을 만드는 몇 개월동안 계속 풀리지 않는 고민이었던 bottom navigation bar 문제에 관해 포스팅 해보려고 한다. 처음은 IndexedStack을 사용하여 구현하였다. 다만 이 방법에 문제를 발견하
React Router
리액트는 SPA방식이고 기존 웹 페이지처럼 새로윤 웹페이지를 사용하는게 아니고 페이지를 로드하지 않고 필요한 데이터를 가져온다! url에 따라 선택된 데이터를 페이지에 렌더링 해준다.\-사용하기전 라이브러리 설치 방법 터미널에 npm install react-route
개념 - React Router
먼저 브라우저의 url과 리액트앱을 연결하는 기능을 하는 < BrowserRouter > 컴포넌트로 App 컴포넌트가 return하는 부분을 감싸준다.페이지의 주소가 변하면 변할 부분을 < Routes > 로 감싸준다변할 페이지 컴포넌트를 < Route
BE_[Node] API Architecture & Layered Pattern
요약코드의 아키텍처(architecture) : 코드의 구조를 더 체계적으로 그리고 효율적으로 구현하는 것.아키텍쳐 적용의 중요성 : 확장성, 재사용성, 유지 보수 가능성, 가독성, 테스트 가능성관심사 분리 : 각 코드의 역할을 독립적으로 분리할 필요가 있다.코드 구조
토이프로젝트_포토앨범(2단계 mongoose로 document의 schema 생성하기)
업로드한 이미지와 텍스트를 mongodb에 저장하게 될텐데 mongodb는 schema가 없는 noSQL document 데이터베이스이기 때문에 mongoose를 사용해서 document의 structure을 잡아준다. (database > collection > do
React Router
React SPA에서는 경로(Route)에 따라 다른 뷰를 보여줄 수 있다. 라우팅에 따라 다른 뷰를 보여주기 위해 React에서는 React Router라는 라이브러리를 사용한다. SPA & Routing SPA는 하나의 페이지를 가지고 있지만 사실 한 종류의 화면
Angular Routing
App-routing.module.ts Routes forRoot forChild loadChildren 앵귤러 프레임워크에서 라우팅관련해서 자주 접하던 메소드들에 대해서 알아보고 라우팅 path에 대해서도잠시나마 삽질 했던 부분에 대해서 기억하고자 글을 남깁니다.기
[2022.07.13] 리액트 라우터 - useNavigate
react-router-domuseNavigate는 페이지를 이동할 때 사용된다.Link를 써도 페이지 이동을 시킬 수 있지만 단순하게 이동만 시켜야 하는 경우 Link를 사용하면 좋고useNavigate를 사용하면 특정 이벤트가 실행됐을 때 동작하도록 하거나 추가적인
[2022.07.12] 리액트 라우터 사용하기(Routes, Route, Link)
리액트 라우터를 사용하면 URL에 해당하는 페이지를 보여줄 수 있다.리액트 라우터는 컴포넌트 기반으로 라우팅을 세팅할 수 있다.리액트 라우터 라이브러리를 설치해서 사용해야 한다.설치를 완료했다면 index.js 파일에서 다음과 같이 세팅을 해준다.BrowserRoute
[Flutter] Splash
앱 개발을 할때에 가장 기본이 되는 스크린이 바로 스플래시를 보여주는 스크린일 것이다. 스플래시의 기능은 보통 스플래시 스크린을 띄우는 동안 사용자의 정보를 체크하거나 초기 데이터 세팅을 위해서 짧게는 1초 이내에서 길게는 3초 정도의 화면을 보여주는 것을 말한다.간단
React v6 관련 수정 사항
블로그를 따라하다보니 React 버전이 달라서 일부 코드가 아예 동작하지 않았다.아직 문법 구조를 익히고 있는 중이기 때문에 당장 소스에서 필요한 부분 위주로 달라진 곳만 고침
[React] react-router-dom
react-router-dom은 웹에서 페이지 이동 기능을 구현하기 위한 라이브러리이다. Routing이란 네트워크간 데이터 전송의 최적 경로를 선택하는 과정이다. 여기서 최적 경로는 최단거리가 될 수도 있고, 가장 빠른 시간에 전달하는 것으로 계산될 수도 있다.Rou
RESTful Routes
Get : 데이터를 가져올 때 쓰임 (fetch하면 기본 명령어 속성이 Get임)Post : 데이터를 생성할 때 쓰임.Put : 데이터를 수정할 때 쓰임(Patch 라고도 불림)Delete: 데이터를 삭제할때 쓰임/items + get 명령어 = 아이템읽어오기/item
Login UI with Component(2), FontAwesomeIcon, routes
위에서 만든 Login UI component들을 Login.js page에 적용함FontAwesomeIcon을 사용해서 인스타 아이콘 및 다양한 icon을 사용함.
[CS] MVC Day-79
What is MVC? Model - View - Controller architectural pattern that separates an application into three main logical components. Each of these component
[CS] MVC Day-50
소프트웨어가 돌아가는 방식에 대한 patternModelViewController데이터를 정보를 가지고 있다. (Database와 연결된 상태에서 가져올 수 있거나..) Controller와 소통한다.View에서 일어나는 Action과 Event를 받아 가공 후 Mod
React : Switch 기본 사용법 , 페이지를 찾을 수 없습니다 컴포넌트 구성
v5인 경우 Swich를 사용하고, v6인 경우 Routes 로 변경되었다.👉 v5👉 v6개인적으론 v5가 직관적이도 맘에든다..기본 App.js 에서 Route를 구성할때 Swich로 감싸주면 route 기능을 좀 더 실용적으로 사용할 수 있다.Route를 감싸는
'Switch' is not exported from react-router-dom' / All component children of <Routes> must be a <Route> or <React.Fragment> 에러 해결법
<참고 사이트> React Router<Switch> 대신 <Routes>로 변경한다 현재 버전의 react-router-dom(12/7 기준 ver 6.0.2)을 사용중이라면, 위의 코드처럼 <Switch>를 쓰지 못한다. 공식 문서에