# ant Design

모달창 적용시 확인 취소, 두가지 버튼이 필요 없을 시
프로젝트 중에 결제버튼을 누르면 훼손관련 주의사항릐 모달이 뜨게 하고싶었다.그런데 보니 확인, 취소가 함께 있었고, infoModal 등은 상황에 맞지 않는다고해야하나... 디자인부분이 맞지 않아 방법이 없는지 확인해보았다.그러다가이 답변을 보았다.ant-design에

[TIL] Ant Design 훑어보기 - Button
Ant Design 훑어보기 - Button사내 디자인 시스템을 구축하던 중에 버튼 컴포넌트의 설계를 어떻게 가져가야할지 고민을 하다가React 에서 2번째로 유명하다고 소개하고 있는 Ant Design 라이브러리 코드를 참조해 보기로 했다.https://gi
[React] ant-design 사용
ant-design 사용 및 설치 ant-design설치yarn add antd아이콘은 따로 설치 필요함yarn add @ant-design/iconsimport {ㅡㅡㅡ} from "@ant-design/icons"; <ㅡㅡㅡ />;icon은 글자이므로 f

12day - Ant-Design, State&Prev
Ant-design에는 id값을 주어도 먹히지 않는다. id값을 주고 싶다면 span, div로 감싸서 id값을 주어야 한다.css와 결합해 사용할 때는 emotion과 합쳐서 쓰면 된다.라이브러리에서 가져온 아이콘이 내가 생각했던 모양과 다른 경우는, 그 라이브러리에

Next.js 예제 템플릿으로 환경 설정하기 (Next.js, Typescript, Ant Design)
📝 프리온보딩 프론트엔드 코스 과제를 수행하며 Ant Design UI 라이브러리를 활용할 기회가 생겼다. 해당 과제를 수행하며 Ant Design 사용법을 익힐 수 있었는데 그간의 주요 내용을 기록해보고자 한다.styled-components 사용이 개인적으로 익숙
[React] ant-design 사용하기!
바퀴를 재발명하지마라! 1\. 시간절약2\. 버그 최소화vsCode에 ant-Design 설치yarn add antd아이콘은 따로 설치가 필요하므로 추가 설치yarn add @ant-design/iconsvsCode에서 import하여 사용브라우저에서의 출력물 : ic
[React]Ant-design
사용법 > npx create-react-app antd-demo : antd-demo 폴더에 cra 생성 yarn add antd : antd 설치 필요한 부분 import하여 사용하기 npm i antd 🐔참고문헌 공식사이트 https://ant.design/
React - Ant Design
1차 프로젝트 때는 외부 라이브러리 사용 없이 모든 기능을 수작업으로 만들었었다.(ex. 애증의 캐러쉘,,,,)근데 2차 프로젝트에서는 드디어 라이브러리 사용이 가능하다 얏호\~~!!리액트에서 라이브러리를 사용할 수 있게 되어 기쁜 것도 잠시, 스타일값을 적용하고 내가

라이브러리 사용하기
ant-Design, Material-UI Ant-Design과 Material-UI는 디자이너의 도움 없이 개발자가 스스로 디자인된 컴포넌트를 만들 수 있도록 도와주는 UI 프레임워크입니다. 만약 조금 더 간편하고 예쁘게 만들고 싶으면 적용해보세요! ant-Design 사이트 Material-ui 사이트 1. 다양한 아이콘들 2. 색다른 체크박...
CSS framework Ant design 사용해보기
중국에서 만든 UI를 위한 라이브러리이다.React,Angular,Vue를 위한 컴포넌트 라이브러리 버전 또한 존재한다.초보자도 쉽고 빠르게 사용할 수 있다.단점: Less 기반이어서 styled-components와 호환이 안좋다.나는 cra를 이용해서 typescr

코드캠프 FE 11일차 - TIL(Event-bubbling / Event - Delegation, Library)
📔 3주차 학습목표 클릭 문제 >> Event-bubbling / Event - Delegation 이미 만들어졌다고? >> Library UI의 전체적인 구조를 잡아놓자 >> Layout 다른 페이지도 보여줘 >> Pagination / Infinite-Scrol

12)언제까지 alert?! 예쁜 Modal을 써보자! 라이브러리엔 기부니가 좋은게 많다구! (code-camp FE 6기)
오늘의 일정 오늘은 일찍와서 ! 알고리즘 풀기 , 자바스크립트 기초 공부하기, 포트폴리오 별점기능구현, 목록페이지 ui, 코드젠 연결, 좋아요싫어요 구현, 유투브 구현... 이것들을 할거라고 적어놨는ㄷ ㅔ! ㅎㅎㅎㅎ아마 오늘 집가기 전까지 하겠지.....<<

11) 인기짱 라이브러리들을 쓰자! ant-design! 이벤트 버블링! 근데 이번주 월화수목금은 25시간 잘수있을까 (?) (code-camp fe 6기)
goodmorning self study이제 알고리즘이 어렵다 나에게 너무...풀었던 문제도 다시 푸는 습관을 들여야한다.. 이문제는 풀이보고 겨우 이해한 문제이고..! 이문제는 풀이를 찾아보고도 이해못한 문제 ^^>...눈물나네 아침부터 굿모닝 아니네.... 이따 알
220325 TIL
Instead of useHistory() function or history props contained in <Route /> component in v5, we use useNavigate() function to move page inside an even

코드캠프 부트캠프 12일차
Ant-design은 디자이너의 도움 없이 개발자 스스로 디자인된 컴포넌트를 만들 수 있도록 도와주는 UI프레임워크 이다.사이트 주소 : https://ant.design/사이트에 들어가게되면 Button, Icon, Calendar, 등.. 다양한 기능들을

리액트 UI라이브러리 앤트디자인(Ant Design) 사용후기
주의사항 저는 리액트의 '리'도 모르는 사람입니다. UI프레임워크는 '처음' 입니다. 앤트디자인을 써본지 2주정도! 하루에 2시간이상정도 만져본 사람의 후기입니다. 사용하게 된 계기 Ant Design을 사용 하게된 계기는 엄청 단순했다. 토이 팀프로젝트를 하는데 팀

moment 주차 표현 방법
antdesign의 RangePicker 사용 시 format을 YYYY-wo로 설정 시 년도가 맞지않는 이슈 발생. antd의 WeeklyPicker확인 시 년도 정상 처리 -> 단, 서버에서 보내주는 주차 계산이 다름 2020.12.30 에 대해서 서버는 20
.gif)
Ant Design Docs for Alfred Workflow
현재 솔리다리테 프론트엔드에는 Ant Design UI, tailwindcss 등을 활용하여 개발중입니다. 공식 Docs에서 권장하는 방식으로 개발하기 위해 자주 문서를 확인하는 편입니다.하지만 매 번 확인할 때마다 크롬을 키고, 독스 페이지에 들어가 확인하려는 세부