![[React][개발기] 6. Stateless하기 만들기, 페이지 만들기, 그리고 Map 활용](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2FENfVo%2FbtsIDUaEOjk%2FAAAAAAAAAAAAAAAAAAAAABMilh-4JKKjtEgrjAzY5bNELjhIisnMjB49XwrfQJx6%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1756652399%26allow_ip%3D%26allow_referer%3D%26signature%3Dyu5Y%252FzHoVCp1%252F7Sz%252BLL4T18O2l8%253D)
깃허브 주소 ▼ GitHub - NOGUEN/dilemma_cafe_webContribute to NOGUEN/dilemma_cafe_web development by creating an account on GitHub.github.com 개요목표 메인 화면의 컴포넌트는 어느정도 다 만들었다고 생각이 들어 약간의 수정을 한 뒤, 라우팅을 넣기로 했다. 또한 현재 매직넘버와 반복되는 세세한 코드들이 너무 많다고 생각되어 전역 스타일과 자주 사용되는 값들을 관리하는 객체를 만들기로 했다. 또한 이제와서 코드를 다시 훑어보니 Stateless하지 않은 컴포넌트가 몇 보여 이 역시도 수정하기로 했다. 그래서 이번 목표는 전역 스타일 수정, Stateless하게 수정, 라우팅이다. 전역 스타일 수정 기존에 ..
![[React][개발기] 5. Component 이어서 만들기와 고민 해결](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2Fcp9q3O%2FbtsIBXGmg7M%2FAAAAAAAAAAAAAAAAAAAAAF45DQ3HVDysb-1Ix7yL7n99NAm00VucFux4AccquKM2%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1756652399%26allow_ip%3D%26allow_referer%3D%26signature%3D16zUK8MsV2Z2VjpQdJc9ZR4orlE%253D)
깃허브 주소 ▼ GitHub - NOGUEN/dilemma_cafe_webContribute to NOGUEN/dilemma_cafe_web development by creating an account on GitHub.github.com 개요이전 글의 SquareButton과 SquareButtonContainer의 구조에 대한 고민 참고 ▼ [React][개발기] Styled-Component로 Component 만들기개요 대략적인 학습이 끝났으니 이제 본격적으로 개발에 들어가려고 한다. 시행착오를 겪으면서 배우면 더 기억에 잘 남아서 무작정 만들기로 했다. 이번 목표는 네비게이션 바, 메인 버튼 2개noguen.com 목표 전에 Styled-Component로 메인 버튼 컴포넌트를 만들던 도중 ..
![[React][개발기] 4. Styled-Component로 Component 만들기](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2FcF2YzL%2FbtsIAuxmAIe%2FAAAAAAAAAAAAAAAAAAAAANuYKBMv5Kbr5v3WEIRouY5-LW-CegxW-QDtwWV4q3q7%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1756652399%26allow_ip%3D%26allow_referer%3D%26signature%3DXiaxQvHEnuBSn6pGGoo6BR0PBsk%253D)
깃허브 주소 ▼ GitHub - NOGUEN/dilemma_cafe_webContribute to NOGUEN/dilemma_cafe_web development by creating an account on GitHub.github.com 개요 대략적인 학습이 끝났으니 이제 본격적으로 개발에 들어가려고 한다. 시행착오를 겪으면서 배우면 더 기억에 잘 남아서 무작정 만들기로 했다. 이번 목표는 네비게이션 바, 메인 버튼 2개을를 만드는 것이다. 메인 화면의 요소부터 만들고, 이후에 리스트 셀을 만든 후, 페이징, 그리고 네비게이팅에 대해 알아보려고 한다. Flutter나 기존에 잘 아는 프레임워크 혹은 라이브러리를 사용했다면 아마 폴더 구조, 디자인 패턴, 네트워킹 방식, 데이터 처리 방식 등등 기본적..
![[React][개발기] 3. 우선 기초적인 것들부터 학습2(HTML, CSS, JS)](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2FMwsXf%2FbtsIxZEZSiG%2FAAAAAAAAAAAAAAAAAAAAACD85reOHuTXOpf58baz2d3OkiQQp0DuwPuKYGzCxZKK%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1756652399%26allow_ip%3D%26allow_referer%3D%26signature%3DUgA%252Bj3Y2l0l71LII%252Fd%252B5tWfLb5k%253D)
깃허브 주소 ▼ GitHub - NOGUEN/dilemma_cafe_webContribute to NOGUEN/dilemma_cafe_web development by creating an account on GitHub.github.com 개요이전 포스트 참고 ▼ [React][개발기] 우선 기초적인 것들 부터 학습(HTML, CSS)개요이전 글 참고 ▼ [React][개발기] React! 근데 React를 왜 써?개요 웹을 시작하게 된 이유 기존에 모바일로 개발하던 서비스에 배포 문제가 발생하면서 다 완성을 해도 배포에 시간이 걸리게 됐noguen.com 학습 현황과 방향 이전 포스트에 이어서 기초적인 것들(HTML, CSS, JS) 학습을 마쳤다. 완벽하게 공부한 것은 아니지만 '대략 이렇게 접근하..
![[React][개발기] 2. 우선 기초적인 것들부터 학습(HTML, CSS)](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2FbgBMYR%2FbtsIz5QOqzr%2FAAAAAAAAAAAAAAAAAAAAAC7xCkwBRdZSlQDiD5l14SX4328Qw6MSY0pyIsG2rvod%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1756652399%26allow_ip%3D%26allow_referer%3D%26signature%3DLpwNrJo07uneNlSg2YblBgURWb8%253D)
깃허브 주소 ▼ GitHub - NOGUEN/dilemma_cafe_webContribute to NOGUEN/dilemma_cafe_web development by creating an account on GitHub.github.com 개요이전 글 참고 ▼ [React][개발기] React! 근데 React를 왜 써?개요 웹을 시작하게 된 이유 기존에 모바일로 개발하던 서비스에 배포 문제가 발생하면서 다 완성을 해도 배포에 시간이 걸리게 됐다. 그래서 그 동안에 배포가 빠르고 모바일 웹, 혹은 데스크noguen.com 본격적으로 앱으로 만들어져있던 기본 서비스를 웹 버전으로 만들려고 했으나, 문제가 있었으니... 바로 필자가 웹 개발을 한 번도 안해봤다는 것이다. 이전 글은 웹 개발을 공부하기 위한..
![[React][개발기] 1. React! 근데 React를 왜 써?](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2Fciks7q%2FbtsIxZYZysB%2FAAAAAAAAAAAAAAAAAAAAAJim9sXwRtUPjsiOpd_iMskvrMxwie5z6fXm9xrqXQra%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1756652399%26allow_ip%3D%26allow_referer%3D%26signature%3D%252FHzx8T7rrrMCw5g7P5SG0ZOYStk%253D)
깃허브 주소 ▼ GitHub - NOGUEN/dilemma_cafe_webContribute to NOGUEN/dilemma_cafe_web development by creating an account on GitHub.github.com 개요 웹을 시작하게 된 이유 기존에 모바일로 개발하던 서비스에 배포 문제가 발생하면서 다 완성을 해도 배포에 시간이 걸리게 됐다. 그래서 그 동안에 배포가 빠르고 모바일 웹, 혹은 데스크톱 웹에서도 쉽게 접근할 수 있게 웹으로 배포하고자 했다. 요즘 세대는 모바일로 접근이 빠르지만, 나를 비롯해 나보다 나이가 조금 있는 윗세대는 아직은 컴퓨터로의 접근이 조금 더 편한것 같았다. 모두가 즐길 수 있는 컨텐츠인데 특정 연령층만 접근이 빠른 것은 서비스의 목적과 맞지 않..