묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결냉동코더의 알기 쉬운 Modern Android Development 입문
ViewModel이 RepositoryImpl이 아니라 Repository를 생성자로 가지고 있는 것에 대한 질문
제목 그대로 ViewModel이 RepositoryImpl(구현체)이 아니라 Repository(인터페이스)를 생성자로 가지고 있는 것은 SOLID 원칙 중 어느 원칙을 준수하기 위함인지가 궁금합니다.
-
미해결풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]
수업 관련 질문합니다.
- 본 강의 영상 학습 관련 문의에 대해 답변을 드립니다. (어떤 챕터 몇분 몇초를 꼭 기재부탁드립니다)- 이외의 문의등은 평생강의이므로 양해를 부탁드립니다- 현업과 병행하는 관계로 주말/휴가 제외 최대한 3일내로 답변을 드리려 노력하고 있습니다- 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기 76분 58초여기서 화살표 아이콘이 화면에 안 나타나요. 1번 <i class="fas fa-chevron-circle-left slide-prev"></i> 2번<i class="fas fa-circle-chevron-right slide-next"></i> 1번은 강사님 화면을 보고 그대로 친 건데 이건 화면에 나타납니다. 근데 2번은 제가 직접 fontawesome에서 찾은 아이콘의 코드를 넣은 건데 화면에 안 나타나요. fontawesome에서 html copy code snippet을 붙여 넣은 것도 화면에 안 나타나고 제가 검사창에서 직접 아이콘 부분 코드를 복붙한 것도 안 나타납니다. 업무자동화, 데이터 분석 등의 아이콘도 처음에 제가 직접 fontawesome에서 html 코드 스니펫을 복붙한 건 안 나타났는데 검사 창에서 코드를 복사하니 나타났거든요. 그게 강사님 코드랑 똑같더라고요. 근데 화살표 아이콘은 강사님이랑 똑같이 코드를 치지 않으면 화면에 나타나질 않아서 제가 아이콘을 바꾸고 싶을 땐 어떻게 적용해야 하는지 알려주세요.지금까지 작성한 전체 코드입니다.index.html<!DOCTYPE html> <html lang="ko"> <head> <meta charset="utf-8" /> <title>잔재미코딩</title> <meta name="description" content="잔재미코딩 온라인 강의 리스트" /> <meta name="keywords" content="Online Lecture" /> <meta name="author" content="Dave Lee" /> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <meta property="og:type" content="website" /> <meta property="og:title" content="잔재미코딩" /> <meta property="og:description" content="잔재미코딩 온라인 강의 리스트" /> <meta property="og:image" content="img/fun-coding-mark.png" /> <meta property="og:url" content="https://www.fun-coding.org" /> <meta property="og:site_name" content="잔재미코딩" /> <meta name="twitter:card" content="summary" /> <meta name="twitter:title" content="잔재미코딩" /> <meta name="twitter:description" content="잔재미코딩 온라인 강의 리스트" /> <meta name="twitter:image" content="img/fun-coding-mark.png" /> <meta name="twitter:url" content="https://www.fun-coding.org" /> <meta name="twitter:creator" content="Dave Lee" /> <link rel="stylesheet" href="css/styles.css" /> <link rel="icon" href="img/fun-coding.ico" /> <link rel="apple-touch-icon" href="img/fun-coding.ico" /> <link rel="shortcut icon" tyle="image/x-icon" href="img/fun-coding.ico" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" /> <script src="https://kit.fontawesome.com/f1def33959.js" crossorigin="anonymous" ></script> <link href="//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSansNeo.css" rel="stylesheet" type="text/css" /> <link rel="stylesheet" href="css/style.css" /> </head> <body> <header> <div class="inner"> <div class="head-container"> <div class="head-brand"> <a href="https://www.fun-coding.org">잔재미코딩</a> </div> <div class="head-blog"> <a href="https://www.fun-coding.org/daveblog.html" >잔재미코딩 블로그 모음</a > </div> </div> </div> </header> <section class="main"> <div class="main-container"> <div class="inner"> <div class="title-container"> <div class="title">광고보다 강의에 집중합니다</div> <div class="message"> 전자책보다 좋은 자료와 현업의 경험을 함께<br /> 검증된 온라인 강의를<br /> 검증된 온라인 플랫폼에서 제공합니다. </div> </div> </div> </div> </section> <section> <div class="inner"> <div class="skill-container"> <div class="skill"> <i class="fab fa-python skill-icon python-style"></i> <div class="skill-title"> <div class="skill-name">업무 자동화</div> <div class="skill-usage">크롤링/자동매매</div> </div> </div> <div class="skill"> <i class="fas fa-chart-bar skill-icon analysis-style"></i> <div class="skill-title"> <div class="skill-name">데이터 분석</div> <div class="skill-usage">데이터 분석</div> </div> </div> <div class="skill"> <i class="fab fa-app-store-ios skill-icon ai-style"></i> <div class="skill-title"> <div class="skill-name">AI</div> <div class="skill-usage">인공지능 활용</div> </div> </div> <div class="skill"> <i class="fab fa-vuejs skill-icon vue-style"></i> <div class="skill-title"> <div class="skill-name">풀스택</div> <div class="skill-usage">웹/앱 서비스</div> </div> </div> </div> </div> </section> <section> <div class="inner"> <div class="roadmap-container"> <div class="roadmap-title-container"> <div class="roadmap-title">잔재미코딩 관련 블로그 및 서적</div> <div class="arrow-container"> <i class="fas fa-chevron-circle-left slide-prev"></i> <i class="fas fa-circle-chevron-right slide-next"></i> </div> </div> <div class="class-list-container"></div> </div> </div> </section> <footer></footer> </body> </html> style.css* { box-sizing: border-box; } body { margin: 0 auto; color: #3f464d; font-family: "Spoqa Han Sans Neo", "Sans-serif"; } a { all: unset; } a:link { text-decoration: none; color: #3f464d; } a:visited { text-decoration: none; color: #3f464d; } a:active { text-decoration: none; color: #3f464d; } a:hover { text-decoration: none; color: #3f464d; } .inner { width: 100%; height: 100%; margin: 0 auto; padding: 0 2rem; } header { width: 100%; height: 60px; background-color: #fff; position: fixed; top: 0; left: 0; z-index: 1000; } .head-container { width: 100%; height: 100%; display: flex; justify-content: space-between; align-items: center; } .head-container .head-brand { font-weight: bold; font-size: 1.2rem; } .head-container .head-brand a:hover { color: #2186c4; cursor: pointer; } .head-container .head-blog { font-weight: bold; font-size: 1.2rem; } .head-container .head-blog a:hover { color: #2186c4; cursor: pointer; } section { width: 100%; background-color: #fff; position: relative; } .main { height: 360px; background-image: url("https://www.fun-coding.org/assets_lms/images/photodune-4161018-group-of-students-m.jpg"); background-size: cover; background-position: center 10%; background-repeat: no-repeat; z-index: 1; } .main-container { width: 100%; height: 100%; background-color: rgb(47, 48, 89); opacity: 0.8; z-index: 2; margin-top: 60px; } .title-container { padding-top: 100px; padding-bottom: 100px; } .title { font-size: 2rem; font-weight: bold; color: #fff; margin-bottom: 0.8rem; } .message { font-size: 1.4rem; font-weight: normal; color: #fff; line-height: 2rem; } .skill-container { width: 100%; height: 100%; display: flex; justify-content: space-around; align-items: center; } .skill { width: 25%; background-color: #fff; display: flex; align-items: center; border-radius: 9px; padding: 0.5rem 1rem; margin: 0.1rem; box-shadow: 10px 10px 10px -5px rgba(25, 42, 70, 0.2); } .skill-icon { font-size: 2.5rem; margin: 0 10px; } .skilltitle { display: flex; flex-direction: column; align-content: center; } .skill-name { font-weight: bold; color: #54536f; margin-bottom: 0.2rem; } .skill-usage { font-size: 0.9rem; color: #54536f; } .python-style { color: #2186c4; } .analysis-style { color: #ff8066; } .ai-style { color: #f7df1e; } .vue-style { color: #2e7d32; } .roadmap-container { width: 100%; margin-top: 2rem; } .roadmap-title-container { width: 100%; display: flex; justify-content: space-between; align-items: center; } .roadmap-title { font-size: 1.3rem; font-weight: bold; color: #54536f; } .slide-prev { font-size: 2rem; cursor: pointer; color: rgb(47, 48, 89); } .slide-next { font-size: 2rem; cursor: pointer; color: #cfd8dc; } @media only screen and (min-width: 1200px) { .inner { max-width: 1200px; } } @media only screen and (max-width: 980px) { .skill-container { display: none; } }
-
해결됨Spring Boot JWT Tutorial
authenticationManagerBuilder에서 getObject를 할때 에러가 뜹니다.
authenticationManagerBuilder.getObject();This object has not been built at org.springframework.security.config.annotation.AbstractSecurityBuilder.getObject(AbstractSecurityBuilder.java:51) ~[spring-security-config-5.7.4.jar:5.7.4] 왜그러는걸까요 추가로 DaoAuthenticationProvider에서 자동으로 additionalAuthenticationChecks해줘서 String presentedPassword = authentication.getCredentials().toString(); if (!this.passwordEncoder.matches(presentedPassword, userDetails.getPassword())) { this.logger.debug("Failed to authenticate since password does not match stored value"); throw new BadCredentialsException(this.messages .getMessage("AbstractUserDetailsAuthenticationProvider.badCredentials", "Bad credentials")); }패스워드를 체크할 수 있다는 글을 보았는데 확인해보니 deprecation이 되어있습니다.사용하지 않는게 좋나요?
-
미해결[아파치 카프카 애플리케이션 프로그래밍] 개념부터 컨슈머, 프로듀서, 커넥트, 스트림즈까지!
카프카 스트림즈 에러 핸들링 질문 드립니다
카프카 스트림즈에서 에러 발생 시 commit이 어떻게 진행되는지 궁금합니다(카프카 스트림즈는 auto.commit 설정을 변경할 수 없는걸로 이해하고 있습니다혹시 잘못 이해하고 있다면 말씀 부탁드립니다~)에러 핸들링 클래스 리턴 타입이 각각 FAIL, CONTIUNE 일 때FAIL이면 커밋 X, CONTINUE이면 커밋 O맞을까요?
-
미해결10주완성 C++ 코딩테스트 | 알고리즘 코딩테스트
split_debug 질문입니다
안녕하세요 큰돌님 split_debug 를 보면서 궁금한 점이 생겼는데요while ((pos = input.find(delimiter)) != string::npos) { longlong pos = input.find(delimiter); cout << "POS : " << pos << '\n'; if (pos == string::npos)break; token = input.substr(0, pos); ret.push_back(token); input.erase(0, pos + delimiter.length()); } ret.push_back(input); return ret;while문의 조건으로(pos = input.find(delimiter)) != string::npos가 있는데 if(pos == string::npos) break 를 하는 이유가 궁금합니다.
-
해결됨스프링 MVC 2편 - 백엔드 웹 개발 활용 기술
ErrorPage를 참조하는 건 누군인가요?
[질문 내용]안녕하세요 강의를 보다가 ErrorPage객체를 참조하는 주체가 누구인 지 궁금해서 질문 올리게 되었습니다!예외가 발생했을 때 WAS까지 넘어오면 WAS가 ErrorPage 객체를 참조해서 에러페이지에 대한 재요청을 보내는 것인가요 아니면 WAS가 DispatcherType을 Error로 해서 재요청을 보내면 프론트 컨트롤러에서 ErrorPage를 참조해서 Controller를 호출하는 건가요?
-
미해결자바(Java) 알고리즘 문제풀이 입문: 코딩테스트 대비
미로탐색(DFS) 질문드립니다
미로탐색(DFS) 문제 풀이중DFS함수내에if(nx>=1 && nx<=7 && ny>=1 && ny<=7 && board[nx][ny]==0) 가 있는데if(board[nx][ny]==0 && nx>=1 && nx<=7 && ny>=1 && ny<=7) 로 변경하면범위오류가 발생합니다 앤드조건임에도 순서를 고려해야할까요..
-
해결됨HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
position 질문
선생님 안녕하세요. 햄버거 메뉴 만들 때label에 position: relativelabel span 에 position: absolute 이렇게 포지션값을 주었는데,사이드바 만들면서 label의 position: relative 를 absolute로 바꿔주게 되는데그럼 label span 의 position: absolute 의 relative는 무엇이 되는 건가요?? label의 포지션을 앱솔루트로 바꿨는데도, label span에는 영향이 없는 이유가 궁금합니다label[for=trigger] { /* border: 1px solid red; */ width: 30px; height: 20px; display: block; position: absolute; cursor: pointer; right: 10px; top: 50%; transform: translateY(-50%); transition: 0.5s; } label[for=trigger] span { position: absolute; height: 2px; background-color: #000; width: 100%; left: 0; transition: 0.3s; } /* sidebar */ .sidebar { background-color: #000; width: 300px; height: 100vh; position: fixed; right: -300px; transition: 0.5s; }
-
미해결실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발
타임리프 파싱 오류
https://drive.google.com/file/d/19kE1MqjQqEW--lxC_1x8EprFxsnAtWRB/view?usp=sharing 주문 목록까지는 나오는데 ORDER로 해놓고 검색을 하면 이렇게 파싱이 안됩니다. 경로도 맞는데 어디서 문제가 있는지 모르겠습니다.거의 다왔는데 마지막에 애먹네요 ㅠㅠ
-
미해결
mysql - ORDER BY FIELD / jpa에서 유사한 기능이 있나요 ?
MySQL IN 절 안에 있는 순서대로 정렬하기SELECT * FROM TABLE WHERE KEY IN (2, 1, 3) ORDER BY FIELD(KEY, 1, 2, 3) ORDER BY FIELD 이 기능이 jpa에도 있나요 ??
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
infinite scroll에서 scroll 위치 기억하는 법에 대해 질문드립니다.
infinite scroll을 하다가 게시글을 누르면 해당 게시글로 이동하고, 뒤로가기를 누르면 원래 보던 scroll 위치로 이동하도록 만들고 싶습니다.마치 인스타그램 게시글들을 보다가 프로필을 누르면 프로필 페이지로 이동하고 뒤로가기를 누르면 원래 보던 위치로 돌아가는 것처럼 구현하고 싶습니다. 시도한 방법scroll 위치는 localStorage를 이용해서 저장했습니다. 문제는 게시글들인데 게시물들은 아래와 같이 ssr을 이용해서 미리 불러왔습니다.export const getServerSideProps = wrapper.getServerSideProps( (store) => async ({ req, query, resolvedUrl, res }) => { // login const cookie = req.headers?.cookie; axios.defaults.headers.Cookie = ""; if (cookie) { axios.defaults.headers.Cookie = cookie; } store.dispatch({ type: CHECK_LOGIN_REQUEST, }); // board if ( store.getState().board.previousUrl === null || store.getState().board.previousUrlType !== query.type ) { store.dispatch({ type: SAVE_PREVIOUS_URL_TYPE, data: query.type, }); store.dispatch({ type: SAVED_POSTS_INITIALIZE, }); store.dispatch({ type: LOAD_BOARD_REQUEST, data: { type: resolvedUrl }, }); } store.dispatch(END); await store.sagaTask.toPromise(); } );게시글 페이지로 이동하면 지금까지 본 게시글들이 사라지고, 다시 돌아오면 load되면서 scrollHeight가 localStorage에 저장된 scroll 위치보다 작아지면서 이동하지 않는 현상이 발생합니다.어떻게 하면 되는지 조언 부탁드립니다.
-
미해결자바(Java) 알고리즘 문제풀이 입문: 코딩테스트 대비
queue를 배우다가 궁금한게 생겨서 질문드립니다.
응급실 문제를 풀고 강의를 듣고 왔는데요큐에서는 왜 get 매서드를 지원하지 않나요?FIFO에 어긋나나요?stack의 경우 vector를 확장해서 쓰기때문에 lifo에 어긋난다라는 글을 본적이 있어서 검색해보니 lifo는 삽입과 삭제의 경우에 해당하는거 같아서요 조회에는 해당하지 않는거 같은데 해당하나요? 아 물론 그냥 얘네가 그렇게 제공을 했다!! 하는거면 그런거겠지만요. 뭔가 그 개념적인? 이유가 있는지 궁금합니다 왜 궁금하냐면!! 어떻게보면 api?에서 제공하지 않는 get을 class를 만들어 편법?적으로 접근하신거같아서 입니다!! 조금 무례한 질문 죄송합니다
-
해결됨실전! 코틀린과 스프링 부트로 도서관리 애플리케이션 개발하기 (Java 프로젝트 리팩토링)
querydslConfig
안녕하세요 강사님. build.gradle을 build.gradle.kts로 변경하고 QuerydslConfig 를 확인해보니@Configuration data class QuerydslConfig( private val em: EntityManager ) { @Bean fun querydsl(): JPAQueryFactory { return JPAQueryFactory(em) } } -> em 부분에 빨간색 밑줄이 뜨고 Could not autowire. No beans of 'EntityManager' type found. 에러가 뜨더라구요. 어떤 부분을 변경해야 빨간 밑줄이 삭제될까요?
-
미해결Spring Cloud로 개발하는 마이크로서비스 애플리케이션(MSA)
코드 제공
익숙한 내용은 강의를 보면서 코드를 따라치기 번거로워서 그런데 강의하시는 코드를 깃허브로 제공받을 수 있을까요?
-
해결됨한 방에 끝! 빅데이터분석기사 실기 작업형
predict 와 predict_proba 차이
predict 와 predict_proba 차이 강의자료에 짧게 있지만 잘 이해가 안되서요 자세하게 차이를 알고 싶습니다!그리고 다중분류일때 사용하는법도 알고 싶습니다! 다중분류일때 predict_proba 를 사용해서 값이나오면 그값이 의미하는것이 무엇인지요~
-
해결됨CS 지식의 정석 | 디자인패턴 네트워크 운영체제 데이터베이스 자료구조
디자인 패턴 자바 문의
안녕하세요 좋은 강의 감사합니다!디자인 패턴은 JS로만 제공되는건가요?
-
미해결
공용계정 생성 문의
3명이서 하나의 계정으로 관리 및 강의결제 하려고 하는데 이용방법이 있을까요?
-
미해결Slack 클론 코딩[실시간 채팅 with React]
채널 생성시 channelData.map is not a function
채널생성 클릭하면 channeldata.map is not a function이라고 에러가 뜨는데channelData뿌려지는곳에 ?옵셔널도 줬고..아래처럼 잘 작성한것같은데 어딜 놓쳤는지 모르겠습니다.새로고침하면 추가된 채널명이 출력됩니다. workspaceimport fetcher from '@utils/fetcher'; import axios from 'axios'; import React, { FC, useCallback, useState } from 'react'; import { Navigate, useParams } from 'react-router-dom'; import useSWR from 'swr'; import { AddButton, Channels, Chats, Header, LogOutButton, MenuScroll, ProfileImg, ProfileModal, RightMenu, WorkspaceButton, WorkspaceModal, WorkspaceName, Workspaces, WorkspaceWrapper, } from './styles'; import gravatar from 'gravatar'; import Menu from '@components/menu'; import { Link } from 'react-router-dom'; import { IChannel, IUser, IWorkspace } from '@typings/db'; import { Button, Input, Label } from '@pages/signup/styles'; import useInput from '@hooks/useInput'; import Modal from '@components/modal'; import { toast } from 'react-toastify'; import CreateChannelModal from '@components/createChannelModal'; const Workspace: FC = ({ children }) => { const { workspace, channel } = useParams<{ workspace: string; channel: string }>(); const { data: userData, error, mutate } = useSWR<IUser | false>('/api/users', fetcher, { dedupingInterval: 2000 }); const { data: channelData } = useSWR<IChannel[]>(userData ? `/api/workspaces/${workspace}/channels` : null, fetcher); if (!userData) { return <Navigate to="/login" />; } const [showUserMenu, setShowUserMenu] = useState(false); const [newWorkspace, onChangeNewWorkspace, setNewWorkspace] = useInput(''); const [newUrl, onChangeNewUrl, setNewUrl] = useInput(''); const [showWorkspaceModal, setShowWorkspaceModal] = useState(false); const [showCreateChannelModal, setShowCreateChannelModal] = useState(false); const [showCreateWorkspaceModal, setShowCreateWorkspaceModal] = useState(false); //functions const onLogout = useCallback(() => { axios .post('/api/users/logout', null, { withCredentials: true, }) .then((res) => { mutate(res.data); }); }, []); const onClickUserProfile = useCallback(() => { setShowUserMenu(!showUserMenu); }, [showUserMenu]); const onClickCreateWorkspace = useCallback(() => { setShowCreateWorkspaceModal(true); }, []); const onCreateWorkspace = useCallback( (e) => { e.preventDefault(); if (!newWorkspace || !newWorkspace.trim()) return; if (!newUrl || !newUrl.trim()) return; //trim ->띄어쓰기 하나도 통과 돼버리는걸 막는다. axios .post( '/api/workspaces', { workspace: newWorkspace, url: newUrl, }, { withCredentials: true, }, ) .then((res) => { mutate(res.data); setShowCreateWorkspaceModal(false); setNewWorkspace(''), setNewUrl(''); }) .catch((err) => { console.dir(err); toast.error(error.response?.data, { position: 'bottom-center' }); }); }, [newWorkspace, newUrl], ); const onCloseModal = useCallback(() => { setShowCreateWorkspaceModal(false); setShowCreateChannelModal(false); }, []); const toggleWorkspaceModal = useCallback(() => { setShowWorkspaceModal(!showWorkspaceModal); }, [showWorkspaceModal]); const onClickAddChannel = useCallback(() => { setShowCreateChannelModal(true); }, []); return ( <div> <Header> <RightMenu> <span onClick={onClickUserProfile}> <ProfileImg src={gravatar.url(userData.email, { s: '28px', d: 'retro' })} alt={userData.nickname} /> {showUserMenu && ( <Menu style={{ right: 0, top: 38 }} onCloseModal={onClickUserProfile} show={showUserMenu}> <ProfileModal> <img src={gravatar.url(userData.email, { s: '28px', d: 'retro' })} alt={userData.nickname} /> <div> <span id="profile-name">{userData.nickname}</span> <span id="profile-active">Active</span> </div> </ProfileModal> <LogOutButton onClick={onLogout}>로그아웃</LogOutButton> </Menu> )} </span> </RightMenu> </Header> <WorkspaceWrapper> <Workspaces> {userData.Workspaces?.map((ws: IWorkspace) => { return ( <Link key={ws.id} to={`/workspace/${123}/channel/일반`}> <WorkspaceButton>{ws.name.slice(0, 1).toUpperCase()}</WorkspaceButton> </Link> ); })} <AddButton onClick={onClickCreateWorkspace}>+</AddButton> </Workspaces> <Channels> <WorkspaceName onClick={toggleWorkspaceModal}>Sleact</WorkspaceName> <MenuScroll> <Menu show={showWorkspaceModal} onCloseModal={toggleWorkspaceModal} style={{ top: 95, left: 80 }}> <WorkspaceModal> <h2>Sleact</h2> {/* <button onClick={onClickInviteWorkspace}>워크스페이스에 사용자 초대</button> */} <button onClick={onClickAddChannel}>채널 만들기</button> <button onClick={onLogout}>로그아웃</button> </WorkspaceModal> </Menu> {channelData?.map((v, idx) => ( <div key={idx}>{v.name}</div> ))} </MenuScroll> </Channels> <Chats> {children}</Chats> </WorkspaceWrapper> <Modal show={showCreateWorkspaceModal} onCloseModal={onCloseModal}> <form onSubmit={onCreateWorkspace}> <Label id="workspace-label"> <span>워크스페이스 이름</span> <Input id="workspace" value={newWorkspace} onChange={onChangeNewWorkspace} /> </Label> <Label id="workspace-url-label"> <span>워크스페이스 url</span> <Input id="workspace" value={newUrl} onChange={onChangeNewUrl} /> </Label> <Button type="submit">생성하기</Button> </form> </Modal> <CreateChannelModal show={showCreateChannelModal} onCloseModal={onCloseModal} setShowCreateChannelModal={setShowCreateChannelModal} /> </div> ); }; export default Workspace; createChannelModalimport Modal from '@components/modal'; import useInput from '@hooks/useInput'; import { Button, Input, Label } from '@pages/signup/styles'; import { IChannel, IUser } from '@typings/db'; import fetcher from '@utils/fetcher'; import axios from 'axios'; import React, { useCallback, VFC } from 'react'; import { useParams } from 'react-router-dom'; import { toast } from 'react-toastify'; import useSWR from 'swr'; interface Props { show: boolean; onCloseModal: () => void; setShowCreateChannelModal: (flag: boolean) => void; } const CreateChannelModal: VFC<Props> = ({ show, onCloseModal, setShowCreateChannelModal }) => { const [newChannel, onChangeNewChannel, setNewChannel] = useInput(''); const { workspace, channel } = useParams<{ workspace: string; channel: string }>(); const { data: userData } = useSWR<IUser | false>(`/api/users`, fetcher); const { data: channelData, mutate } = useSWR<IChannel[]>( userData ? `/api/workspaces/${workspace}/channels` : null, fetcher, ); const onCreateChannel = useCallback( (e) => { e.preventDefault(); axios .post( `/api/workspaces/${workspace}/channels`, { name: newChannel, }, { withCredentials: true }, ) .then((res) => { setShowCreateChannelModal(false); mutate(res.data); setNewChannel(''); }) .catch((err) => { console.dir(err); toast.error(err.response?.data, { position: 'bottom-center' }); }); }, [newChannel], ); return ( <Modal show={show} onCloseModal={onCloseModal}> <form onSubmit={onCreateChannel}> <Label id="channel-label"> <span>채널</span> <Input id="channel" value={newChannel} onChange={onChangeNewChannel} /> </Label> <Button type="submit">생성하기</Button> </form> </Modal> ); }; export default CreateChannelModal;
-
미해결HAL, CubeMX, TrueSTUDIO를 이용한 STM32F4 무료 강좌
가감속 테이블
안녕하세요 선생님PWM 주기 변경을 보고 가감속 테이블을 만들어서 테스트를 진행할려고 하는데 속도가 너무 빨라서 그런지 몰라서 점점 빨라지다가 동작이 멈춰버리는데 혹시 요령이나 방법을 알 수 있을까요?
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
상품이 아래로 나열되요 ㅜ
똑같은 css파일인데 왜 다르게 나타날까요 ㅠㅠ위가 처음에 react없이 그냥 html로만 만든거구요아래가 react로 만든건데같은 index.css파일인데 왜 다르게 나타날까요 ㅠㅠ
