학원에서 배운 것/React15 React 로 카카오톡 공유하기 기능 추가해보기 https://developers.kakao.com/tool/demo/message/kakaolink?message_type=scrap Kakao Developers 카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다. developers.kakao.com 카카오API 중 공유하기를 사용해보려고 한다... 이유는 만들고 있는 사이트에 저 버튼(노란..)을 만들어버렸기 때문이다. 구현방법을 체크하여 코드를 가져올 수 있는데, 직접 만든 버튼으로 메시지 > 기본 > 피드 를 선택하면 이런식으로 카카오톡 공유가 가능하다. 직접 만든 버튼 > 사용자 정의 메시지의 경우 그럼 이제 이걸 어떻게 리액트에 적용하는가가 문제인데, .. 2023. 5. 15. 팀플을 하면서 시도했던 드래그앤드롭 코드들.. 결국 dnd 라이브러리로 성공은 했지만 노가다와 삽질한 흔적을 남겨본다... // 드래그앤드롭 시안 1 const [originPos, setOriginPos] = useState({ x: 0, y: 0 }); const [clientPos, setClientPos] = useState({ x: 0, y: 0 }); const [pos, setPos] = useState({ top: 100, left: 0 }); const draggingRef = useRef(null); const draggingOverRef = useRef(null); const dispatch = useDispatch(); const onDragOver = e => { e.preventDefault(); }; const onDrag.. 2023. 4. 22. 우당탕탕.. 팀프로젝트 리액트로 드래그 앤 드롭 구현하기 바닐라 JS 로 했듯... 이번에도 드래그앤드롭 구현을.. 맡아버렸다 근데 좀더... ?? 띠용한거 같다... 왜냐하면 전에 드래그앤드롭은 그냥 아무 위치에 스티커를 붙여주는 느낌이라면 이번 프로젝트는 드롭 타겟에 촥!! 붙어야 하는데 이게 가능할지 잘 모르겠다 ...ㅠㅠ 일단은 서칭과 노가다의 힘으로 드래그앤 드롭은 되긴한다! const onDragOver = e => { e.preventDefault(); }; const onDragStart = e => { e.dataTransfer.effectAllowed = 'move'; const originPosTemp = { ...originPos }; originPosTemp.x = e.target.offsetLeft; //칸반보드 컨텐츠 부분부터 ori.. 2023. 4. 12. KDT 5th 웹개발자 입문 수업 ... 마지막 팀 프로젝트 시작! 실은 엊그제부터 조금씩 주제 선정하고 레이아웃 잡긴 했지만... 피그마 라는 사이트를 활용하여 이거저거 레이아웃 작업을 하고 있다. 포토샵보다 불편한거 같긴 하지만... 그래도 쓸만해서 이거저거 해보고 있다. 일단 주제가 프로젝트 관리 사이트라서 빡셀거 같긴 하다만...ㅎㅎ 힘내서 이번주까진 레이아웃을 완성하고 리액트 작업을 들어가볼 예정이다! 2023. 4. 8. 이전 1 2 3 4 다음
