다른게 아니라 hr태그 넣는데 기본적으로 배경이 있더라 흰색 배경에서는 티가안나지만 hr태그자체가 마진이랑 패딩을 (margin,padding)가지고 있는것 같다. Custom.css hr{ margin-top: 0; margin-bottom: 0; border: 0; border-top: 2px solid rgb(253, 2, 2); } 이런식으로 커스텀이 가능하다 색상부터 여러 속성을 넣어주는게 전부가능! 유용하게 가끔 써보도록하자, Navbar관련해서 경계를 주거나 배경있는곳에서 경계를 줄때 유용해 보인다. 종종 쓸거같음 https://stackoverflow.com/questions/41948516/how-to-set-background-color-on-hr-tag How to set backgr..
- 색상관련꿀팁 1.https://www.colorion.co/ Colorion Curated Color Palettes with Search and Tags Support www.colorion.co 2.https://2colors.colorion.co/ Two Color Combinations Two color combination palettes 2colors.colorion.co -아이콘 관련사이트 https://www.flaticon.com/free-icons/beer-cheers 863 Free icons of beer cheers Download over 863 icons of beer cheers in SVG, PSD, PNG, EPS format or as webfonts. Flatico..
별거 아니지만 별거인..? 프로젝트중에 Navbar를 부트스트랩에서 가져와서 사용하고있는데 Navbar를 커스터마이징하려고 하다가 기록해둔다. https://react-bootstrap.github.io/components/navbar/ React-Bootstrap The most popular front-end framework, rebuilt for React. react-bootstrap.github.io 이와같이 기본적으로 제공하는 색상이 있다. 근데 이걸 커스터마이징하려면 react-bootstrap에서는 간단한 설정이 필요하다. https://react-bootstrap.github.io/getting-started/introduction React-Bootstrap The most popul..
https://developer.mozilla.org/en-US/docs/Web/CSS/background-position background-position - CSS: Cascading Style Sheets | MDN The background-position CSS property sets the initial position for each background image. The position is relative to the position layer set by background-origin. developer.mozilla.org 위의 링크에 전부다있다. 부트스랩이나, MUI같은경우는 해당 문서에 더 정확하게 혹은 저거보단 적게 지원하기도 하니까 확인해보면서 위치를 정하자!
F12를 눌러보면 indexedDB는 브라우저에 데이터를 영구적으로 저장할 수 있는 방법중 하나 네트워크 상태에 상관없이 풍부한 쿼리 기능을 이용할 수 있는 웹 어플리케이션을 만들 수 있다. 온오프라인 두곳에서 동작하게 만들 수있는것! (물론 초기화하거나 지우면 삭제된다!) key-value로 데이터를 관리한다. (transaction database) Local Storage, Session Storage의 가장 큰 차이는 영구성 Local Storage는 기기와 플랫폼이 허락하는한 데이터를 저장 Session Storage는 브라우저를 닫으면 데이터가 삭제됨 5~10MB사용 가능 Cookie 저장 가능한 공간의 크기가 매우 작고 텍스트 형태로 저장 만료시간 설정이 가능하다 요청에 실어서 서버로 전송하..
https://mui.com/getting-started/installation/ Installation - MUI Install MUI, the world's most popular React UI framework. mui.com https://mui.com/styles/basics/ @mui/styles - MUI The legacy styling solution of MUI. mui.com 맨위에 2개는 MUI관련 세팅 페이지들이다. 1)npm이나 yarn으로 우선 리액트 프로젝트내에 설치해준다. 2)index.html 에 CDN넣어준다. 3)그리고 style관련해서 문제가 생기거나 필요해지면 위에 2번재링크의 style관련한 것도 설치해주면 크게 문제없이 사용가능! 사용법은 부트스트랩과 거의 유..
https://docs.openvidu.io/en/stable/demos/openvidu-call-react/ openvidu-call-react - OpenVidu Docs From here you can search these documents. Enter your search terms below. docs.openvidu.io 들어가자마자 화상방 + 채팅이있는 구성으로 되어있다. 지금 프로젝트 진행하는데 딱 필요한 구성! 위페이지들어가면 1~5까지 순서가 나오는데 해보니까 2번의 sudo코드는 안먹히고..? 윈도우에서는 관리자권한으로 실행하거나 다른 방법이 있는거같은데 여튼 3번부터 진행해도 충분했고 잘 진행되었다. (노드와 도커는 깔려있는 상태) 이와같이 2개의 터미널을 띄워야하고 접속은 300..
https://docs.openvidu.io/en/stable/tutorials/openvidu-insecure-react/ openvidu-insecure-react - OpenVidu Docs From here you can search these documents. Enter your search terms below. docs.openvidu.io 위와같이 클라이언트 사이드에서 작동하는 React화된 Openvidu 튜토리얼을 해봤다. 프로젝트중이라 어딜 수정해서 커스텀해야할지 봐야하기 때문 튜토리얼 링크에보면 1) Clone the repo: git clone https://github.com/OpenVidu/openvidu-tutorials.git -b v2.20.0 2) You will ne..