본문 바로가기

front-end3

0055. 실전 FE 개발 배우기12 - 웹소켓 연결하기, 실시간 데이터 받기, 로그아웃(Bearer 토큰) 섹션 2. 서버 API 연동하기 8강. 웹소켓 연결하기 1) 웹소켓 기반 라이브러리 요청-응답 방식이 아니라 실시간 양방향 통신 가능 기존 : app → axios → 응답 소켓 : 한 번만 연결을 맺으면 연결이 끊어지기 전까지 실시간으로 가능. 서버에서 먼저 보내줄 수도 있다. 대신, 배터리 소모가 있다. npm i socket.io-client 웹소켓 라이브러리 설치 2) Custom hooks 자주 쓰는 것은 hook으로 만든다. Custom hook에 익숙해져야 한다. import { io, Socket } from 'socket.io-client'; import Config from 'react-native-config'; let socket: Socket | undefined; const us.. 2024. 2. 7.
0050. 실전 FE 개발 배우기7 - 로그인 화면 만들기, TextInput의 다양한 옵션 사용하기(Feat. 진짜 개발 시작!) 섹션 1. 리액트 네비게이션 3강. 로그인 화면 만들기 칠드런이 하나만 오는 때가 생기는데, 그때는 Tab.Group을 사용해서 묶어주면 된다. 이렇게 프레그먼트로 묶어주는 것과 같은 이치다. 이렇게 쓰고 이메일을 입력하라는 부분을 누르면 키보드가 올라온다. TextInput을 썼기 때문 알림을 뜨게 만드는 Alert.alert 이제 꾸미기만 하면 된다. import React, { useCallback, useState } from "react"; import { Alert, Pressable, StyleSheet, Text, TextInput, View } from "react-native"; function SignIn() { const [email, setEmail] = useState(''); .. 2024. 1. 25.
0006. 코딩의 분야와 웹프로그래밍 1. 여의도의 Front와 Back 필자는 금융업에 종사하고 있다. 금융업에서도 Front, Back이라는 말이 자주 등장한다. 주로 고객과 가까울수록 Front라는 말을 쓰고, 고객과 멀리 있으면서 Front와 Middle을 지원하는 것이 Back이다. 즉, 고객과 맞닿는 최전선에서 영업하고 돈을 벌어오면 Front Office고, 고객과 멀리 떨어져서 Front를 지원하는 역할을 하는 것이 Back Office라고 보면 된다. 최근 여의도의 많은 회사들이 복장을 자율화하기 시작했다. 그러면서 점점 정장 중심이었던 여의도룩이 사라지고 조금씩 다양해졌다. 하지만 아직도 과거의 유산은 많이 남아있다. 여의도에서 사람들이 정장을 입고 딱딱한 복장이 많았던 것은 다 이유가 있었을 것이다. 또한, 판교룩이 알록.. 2023. 2. 3.