본문 바로가기

전체 글

 (99)
[JavaScript] 쓸데 많은 정규 표현식 정리 1. 자릿수를 구분하는 함수 const divideNum = (num) => { return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); } 2. 전화번호에 하이픈을 자동으로 추가하는 함수 const addHyphenToPhoneNumber = (phoneNum:String) => { let trimNum = phoneNum.replace(/[^0-9]/g, ""); let collectNum = trimNum.replace(/(^02.{0}|^01.{1}|[0-9]{3})([0-9]+)([0-9]{4})/,"$1-$2-$3"); return collectNum; } 3. 숫자입력을 체크하는 정규식 const numCheck = /^[0-9]+$/ 4...
[React Native] Modal 사용하기 구현 예제를 보려면 "더보기" 클릭! 더보기 Modal 구현 예제 코드 import AsyncStorage from "@react-native-async-storage/async-storage"; import axios from "axios"; import React, { useEffect, useRef, useState } from "react"; import { Alert, Animated, Button, Dimensions, Modal, PanResponder, Pressable, StyleSheet, Text, TouchableOpacity, TouchableWithoutFeedback, View } from "react-native"; import config from "../../../proj..
[React Native] useEffect의 dependency array 사용 시 주의점 useEffect란? useEffect Hook은 클래스형 컴포넌트에서 쓰이던 componentDidMount와 componentDidUpdate, componentWillUnmount가 합쳐진 형태로 최초 렌더링 시 무조건 실행할 작업, 컴포넌트가 업데이트 될 때 작업, 컴포넌트가 언마운트(파괴, 제거)되었을 때 작업을 실행하게 해준다. useEffect 사용 예시 useEffect는 앞서 언급한 것처럼 최초 렌더링시, 컴포넌트 업데이트시, 컴포넌트 언마운트시 실행되는데 실행되는 내용은 useEffect의 디폴트 파라미터인 콜백함수 내부에 들어가게 된다. 예를 들면 import React, { useState, useEffect } from "react"; export default function A..
[React Native] 다른 페이지로 값 전달하기 앱을 개발하다가 현재 페이지에서 useState로 세팅된 값을 넘겨주어야 할 일이 생겼다. export default function PaymentResult() { // ... return ( { if (buyerName === '' || buyerName === null) { Alert.alert('배송지 정보 누락', '받는 사람의 이름이 입력되지 않았습니다.'); } else if (buyerAddr === '' || buyerAddr === null) { Alert.alert('배송지 정보 누락','받는 사람의 주소가 입력되지 않았습니다.'); } else if (buyerAddrDetail === '&..
[Android] Build Error 해결방법: Gradle 초기화 1. Android Development Environment Set Up 관련 에러 내용 Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup. 다음과 같은 빌드 에러 발생 시 gradle을 초기화한다. // android 디렉터리에서 $ chmod +x gradlew // android에서 하나 나와서 $ cd android && ./gradlew clean 2. Execution failed for task ':app:mergeDebugAssets'. 관련 에러 내용 Execution failed for tas..
[React Native] axios를 사용한 비동기 통신과 장면 전환 1. 컨트롤러 axios를 통해 JSON 형태로 데이터를 주고 받는다. 이 때 axios가 url 패턴을 찾아서 값을 전달해줘야 하는데 다음과 같은 컨트롤러를 통해 값을 전달하고 결과를 받아온다. import com.hwangduil.springbootbackend.dto.BbsDto; import com.hwangduil.springbootbackend.service.BbsService; import lombok.RequiredArgsConstructor; import org.slf4j.Logger; import org.slf4j.LoggerFactory; import org.springframework.web.bind.annotation.GetMapping; import org.springframew..
[MySQL] Access denied for user 'root'@'localhost' to database 'information_schema' 해결하는 방법 -- root 계정 비밀번호 변경 alter user 'root'@'localhost' identified '새 비밀번호'; commit(); MySQL의 root 계정 비밀번호가 임의로 변경되어 다시 root 계정의 비밀번호를 바꿔주어 해결한다.
@Autowired 대신 @RequiredArgsConstructor Autowired는 그 이름처럼 상횡에 맞게 IoC 컨테이너 안에 존재하는 Bean을 자동으로 주입해준다. 보통은 다음과 같이 사용한다. @Service public class FoodService { @Autowired private FoodDelivery foodDelivery; } 하지만 요즘의 경향을 보면 스프링팀에서 Autowired의 사용을 권고하지 않는다. 아래와 같이 직접 생성자를 주입하여 사용하거나 @Service public class FoodService { private FoodDelivery foodDelivery; public FoodService(FoodDelivery foodDelivery) { this.foodDelivery = foodDelivery; } } lombok에..

티스토리툴바