텍스트가 너무 길때 ...처리하는 방법을 알아보자. text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical 원하는 곳의 class에 해당 css 넣어 주면 끝난다.wekit-line-clamp를 3으로 변경하면 세번째 줄 이상은 ...처리가 된다    vh 사용할때 모바일에서 오류가 날 경우 해결방안 vh 사용할때 모바일에서 오류가 날 경우 해결방안모바일에서는 상단의  url과 하단의 뒤로가기 앞으로가기가 스크롤에 따라 나타나기도 없어지기도 한다...

tap 만들기1. 제이쿼리 cdn 가져와서 사용하기$(document).ready(function() { function setupTab(tabMenuSelector, tabContentSelector) { // 초기 설정: 첫 번째 탭만 보이도록 설정 $(tabContentSelector).hide(); $(tabContentSelector).first().show(); // 탭 메뉴 클릭 이벤트 등록 $(tabMenuSelector + " li").click(function() { $(tabMenuSelector + " li").removeClass("on"); $(this).ad..

이제 javascript로 해당 data이름을 통해 가져와서 컨트롤 할 수 있다.      자바스크립트 탭만들기 html 코드에 data 값넣어서 제어하기 html 코드에 data 값넣어서 제어하기이제 javascript로 해당 data이름을 통해 가져와서 컨트롤 할 수 있다.ineedurhelp.tistory.com

npm create vite@lastest오늘은 react 2번째 공부입니다. react를 시작하기 전에 설치부터 해야겠죠? react 설치방법을 알려 드리도록 하겠습니다. 제가 설치하는 방법은 vite를 사용해서 설치합니다.    vite 공식문서 바로가기react 공식문서 바로가기 왜 react 앱이라고 하는가?react 설치 방법은?react 폴더별 설명   왜 react앱이라고 하는가?웹 브라우저에서 동작하는 애플리케이션 같아서 그렇게 부르고 있습니다. react 설치 방법은?- 아무 폴더 생성- vs code에서 해당 폴더 열기로 열어주기- 새 터미널 열기- *vite와 함께 react 설치해 주기 *vite:차세대 프런트엔드 개발자 툴*기타 도구 설치 및 설정하는 것이 입문자에게 어렵기 때문에..

안녕하세요. react를 하고자 하는 개발자입니다. 제가 배운 것을 토대로 가르쳐 드리도록 하겠습니다. react 공식문서에 더 욱 정확하게 적혀 있으니 함께 읽으시면 좋을 것 같습니다.react 공식문서 바로가기 react 다운로드하기 react란?- META 즉 페이스북에서 개발한 오픈소스입니다. 커다란 웹 서비스 *UI를 개발하기 위해 만들어진 기술입니다.- react가 사용된 애플리케이션: 넷플릭스, 페이스북, 인스타, 노션 등 *UI : 사용자 인터페이스 즉, 브라우저에서 눈에 보이는 것들을 말합니다. 왜 react를 많이 사용할까?컴포넌트 기반으로 UI 사용가능화면 업데이트 구현이 용이하다.화면 업데이트가 빠르게 처리된다. react 컴포넌트? - 한 화면을 네모 박스로 구분하여 각 박스를 컴..

리액트 인강을 구매하고 싶지만 인강을 구매하기에는 귀찮으신 분들, 저의 얇은 지식으로 도움 드릴테니 같이 공부해봅시다. 리액트를 배우기 이전에 html , css, javascript의 기초 지식이 없으신 분들은 이것부터 공부하고 오셔야 이해하는데 도움이 될 것입니다. 위의 언어들을 모르는데 굳이 보시겠다면 굳이 말리지는 않겠습니다. 액트를 쓰는 이유 javascript로 만들면 매우 긴 코드가 필요하여 javascript로 된 라이브러리인 리액트로 사용하면 간결하고 가독성 있는 코드를 만들수 있습니다. html을 함수, array, object로 보관하여 재사용이 가능합니다. 개발 환경셋팅 - Node.js를 검색후 LTS버전 설치 - 코드 편집기 설치(저는 vsCode를 사용합니다. 이 블로그에서는 ..