본문 바로가기
반응형

coding35

[React]useCallback, Memo 함수 이해하기 안녕하세요. 오늘은 React hook인 useCallback 와 memo 함수에 대해서 정리해 보겠습니다. 그전까지는 사람들이 사용하는 코드만 보고 제 프로젝트에도 적용해 봤지만 실제적으로 크게 필요한 부분에 사용하고 있지 않았습니다. 이번 기회에 확실하게 공부하고 가겠습니다! 예제 코드 App.tsx import React, { useCallback, useState } from 'react'; import './App.css'; import Input from './components/Input'; import Btn from './components/Btn'; function App() { const [input, setInput] = useState(''); const onChange = (e:.. 2022. 5. 7.
[Next] 티스토리 OPEN API next.js 에서 적용하기(1) 안녕하세요. 오늘은 next.js 프로젝트에서 티스토리 open api를 사용해서 블로그에 글 목록, 정보 등을 받아 보도록 해보겠습니다. 티스토리 open api 정리가 잘 돼있어서 어렵지 않게 적용했던가 같은데요. 시작해 보겠습니다! 앱 애플리케이션 등록하기 https://www.tistory.com/guide/api/manage/register TISTORY 나를 표현하는 블로그를 만들어보세요. www.tistory.com 위에 사이트에 접속해줍니다. 오픈 API 이용약관에 대해 동의를 눌러줍니다. 서비스 명과 설명을 잘 적어주고 서비스 URL에 해당 서비스 URL을 적어 주고, CallBack URL에는 데이터를 요청해서 받은 다음 어디로 URL로 보낼지 적어주는 곳입니다. 앱을 등록하면 App .. 2022. 5. 2.
[Next.js]다크모드 구현하기 (sass) 안녕하세요. 오늘은 next에서 scss를 이용해서 다크 모드를 구현해볼 건데요. 왜 css 가 아닌 scss(sass)를 사용하는지 차이점을 비교하고 다크 모드를 구현해보겠습니다. Sass vs Css css 코드 .container { background-color: yellow; } .container div { background-color: green; } .container div a { color: red; } Scss 코드 .container { background-color: yellow; div { background-color: green; a { color: red; } } } 첫 번째로 nesting이 가능하다는 것인데요. 또한, scss에서는 변수, 함수 선언이 가능하고 Mixi.. 2022. 4. 24.
[Next]네이버 API - 로그인 구현 TypeScript 저번에는 kakao api를 이용해서 로그인은 시도해 보았는데요. 이번에는 네이버 api를 이용해서 로그인을 구현해보겠습니다. 2022.04.17 - [coding/front-end] - [Next] 카카오톡 API 로그인 구현하기 [Next]카카오톡 API 로그인 구현하기 안녕하세요 오늘은 next.js에서 카카오톡 api를 이용해서 저에 웹사이트에 적용하는 시간을 가져보겠습니다. 요즘은 카카오톡, 구글, 네이버 그리고 깃 헙 등등으로 로그인을 가능하게 해 주는데 hun-dev.tistory.com 네이버 Developer https://developers.naver.com/apps/#/register 애플리케이션 - NAVER Developers developers.naver.com 1. 접속하기 2.. 2022. 4. 20.
반응형