[Tailwind CSS] 중앙 정렬 할 때 CSS 팁

개발/ReactJS 2021. 11. 3. 08:20

이미지나 div 컨테이너 혹은 p태그를 상위 컨테이너 안의 중앙으로 정렬하고 싶을 때, 원래는 flex flex-col align-center... 와 같이 길게 작성하여야 된다. grid place-items-center면 중앙 정렬이 다 해결된다

Ubuntu Server 18.04에서 wifi network 못찾을 때 해결 방법

개발/DevOps 2021. 11. 2. 08:20

맨처음 Ubuntu Server를 설치하면 유선랜만 작동하고 wifi 랜카드는 인식 자체가 안된다. Ubuntu와는 다르게 Ubuntu Server에는 wireless-tools나 iwconfig가 기본적으로 포함되어있지 않아서 생기는 문제이다. 그래서 유선랜을 연결한 상태에서 아래의 설치과정을 진행해야한다. 1. wireless-tools를 설치한다. $ sudo apt install wireless-tools 2. netplan 디렉토리에 .yaml 파일의 형식으로 netplan 파일을 생성한다. $ sudo nano /etc/netplan/01-netcfg.yaml network: version: 2 renderer: networkd wifis: wlo1: dhcp4: true dhcp6: true..

[ReactJS] 함수형 방식에서 버튼 클릭하여 컴포넌트 추가하기

개발/ReactJS 2021. 11. 1. 08:20

[추가하기] 버튼을 눌렀을 때, 컴포넌트를 추가해야 하는 일이 있었다. //Page.tsx export const Page = () => { const [story, setStory] = useState([]); const addStory = () => { setStory(story.concat()); }; return ( {story} { addStory(); }} /> ) 위와 같이 story를 array 형태의 state로 관리하여 버튼을 클릭했을 때, onClick 이벤트로 story state에 를 추가하는 함수인 addStory( )를 실행하는 방식으로 구현하였다.

.map( )안에 useQuery 사용 시 callback 에러 발생

개발/ReactJS 2021. 10. 30. 08:20

...(users?.map((user: User) => { const { data: userStories } = useQuery( `/admin/${user.id}/stories`, fetcher ); const { data: likes } = useQuery( `/admin/${user.id}/likes`, fetcher ); ------- 생략 -------- } 위와 같이 리턴받은 User타입의 배열을 .map()을 통해 userId별로 useQuery를 통해 api를 호출하려하였는데 callback안에서는 useQuery를 사용할 수 없다고 에러가 발생하였다. const [userId, setUserId] = useState(Number); const { data: users } = useQuer..