프로그래밍32 REACT로 카페 만들기 프로젝트 (2) 서론 이번 프로젝트는 부트스트랩을 사용했다. 부트스트랩은 좀 더 편하게 스타일을 꾸미고 싶을 때 사용한다. 아니, 스타일을 꾸민다기보단 보편화 되어 있는 기능을 편하게 구현하고 싶을 때도 사용한다. 골치아픈 드랍다운 버튼이라던가 말이다. 나는 처음부터 CSS로 전부 구현하는 게 싫어서 부트스트랩을 사용했다. 부트스트랩으로 이미 완성된 컴포넌트를 불러와서 그걸 조금씩 수정하는 게 훨씬 간편하다. 다만 아닌 경우도 있다. 버튼 같은 경우에는 부트스트랩에서 불러오면 워낙 적용된 효과가 많기 때문에 사용자가 색깔을 바꾸는 것조차 쉽지 않다. 적당히 때를 잘 보고 쓸 줄 알아야 한단 소리다. REACT의 부트스트랩 일반적인 자바스크립트 프로젝트에서 부트스트랩을 사용하는 방법과 리액트 프로젝트에서 부트스트랩을 사용.. 2021. 10. 4. REACT로 카페 만들기 프로젝트 (1) 오랜만에 글을 쓴다. 저번에 타입스크립트만으로 카카오톡 클론을 구현해봤는데 프레임워크 없이 하려니까 너무 힘들었다. 그래서 이번에는 프레임워크도 같이 사용해서 그럴싸한 결과물을 만들어보는 걸 목표로했다. 하지만 파이어베이스는 사용하지 않기로 한다. 편리한 만큼 단점도 있고, 무엇보다 서버사이드도 내 손으로 직접 만들어보고 싶기 때문이다. 작업은 현재 중반까지 왔다. 작업을 진행하면서 의도치 않던 상황에 종종 맞닦뜨려 당황했지만 큰 무리 없이 잘 해내온 것 같다. 여전히 초보자의 티를 벗어나지 못하는 작품이지만 나름 만족한다. 사용한 기술은 다음과 같다. React Typescript Bootstrap Express Mongo DB Redux Saga Ckeditor 이 외에는 자질구레한 것들이라 굳이 언.. 2021. 9. 24. 리액트용 부트스트랩 리액트에서 부트스트랩을 사용하는 방법은 import로 불러와서 컴포넌트를 사용한다. 그래서 기존의 부트스트랩과는 사용 방법도 다른만큼 어느정도의 기능의 차이도 있을 거라고 생각한다. 나는 부트스트랩에 대해서 잘 모르기 때문에 답답해서 어떤 기능이 있나 한 번 찾아봤다. 공식 홈페이지의 문서를 참조해서 그냥 이런게 있다 라는 것만 적어봤다. 레이 아웃 문서 내에서 컴포넌트로 분류되지는 않지만 부트스트랩은 레이아웃 기능을 제공합니다. 이 레이아웃은 반응형 flexbox로 만들어졌습니다. Container -> width에 반응형을 준 컨테이너 레이아웃을 사용할 수 있습니다. 가운데로 정렬된 수평의 컨텐츠를 보여주는 데 용이합니다. Fluid Container -> 가로의 해상도에 상관없이 항상 100%의 w.. 2021. 9. 11. 클론 개발 후기.. 기본에 치중하고 싶어서 타입스크립트 만으로 카카오톡 클론을 만들어봤다. 프레임워크가 없어서 쉽지는 않았지만 node.js도 있고해서 그렇게 힘들지는 않았다. 하지만 만들고 보니 기능만 구현하는데 치중했지 코드 자체는 눈을 뜨고 보기 어려울 정도로 지저분하다는 느낌이 들었다. 일단 링크는 아래다. https://ihan12389.github.io/typeTalk Document ihan12389.github.io 문제점은 여러가지 많다. 타입스크립트의 특성은 전혀 살리지 않았다. 리덕스를 사용하지 않아 데이터의 공유가 원활하지 않다. CSS가 반응형이 아니다. 코드의 변수명이나 함수명이 직관적이지 않다. 모듈화가 잘 안이루어져 있다. 내가 느낀 문제점들은 위와 같다. 기능을 구현시킨다고 다가 아니라는 걸 .. 2021. 9. 10. 이전 1 2 3 4 5 6 7 8 다음
