본문 바로가기

분류 전체보기114

내부 webview에 값 전달하기 webview를 어플리케이션으로 감싸서 동작하게 하는 경우가 많다. 이 경우에 어플리케이션 외부의 동작 정보를 내부 웹뷰에 반영시켜야 할 때가 있다.  예를 들면, 환경설정이라던지 혹은 웹뷰 내부에 정의한 함수의 실행이라던지.. 어플리케이션 웹뷰 컴포넌트에서의 코드import { Button, StyleSheet, Text, View } from "react-native";import Constants from "expo-constants";import WebView from "react-native-webview";import { useRef, useState } from "react";function WebViewScreen(){ const [hasError, setHasError] = useStat.. 2025. 3. 20.
React Native Expo 배포용 빌드 이후 에러 리액트 네이티브 엑스포에서 배포용 빌드 이후에 다시 시뮬레이터에서 어플리케이션을 사용하려고 하면  CommandError: No development build (Bundle Identifier 이름) for this project is installed. Please make and install a development build on the device first. 이렇게 뜨는 경우가 있다.  이 경우에는 npx expo start --go 로 go에서의 빌드를 다시 실행해주면 된다. 2025. 3. 20.
npm, package.json, package-lock.json npm initpackage.json 생성npm install npm 모듈 로컬 설치npm install 패키지@버전특정버전 설치npm install --save 패키지이름node_modules 디렉토리에 설치, dependencies 항목에 패키지 추가npm install -g 패키지시스템 전역에 패키지 설치, 해당 프로젝트의 node_modules 디렉토리와 관계 없이 사용가능npm install --save옵션dependencies 항목에 추가가 됨npm install --save-devdevDependencies 항목에 추가가 됨 ** 주의해야npm updatenpm 모듈 업데이트npm dedupe중복된 모듈 정리npm outdated오래된 패키지의 존재 유무를 알려줌npm cachenpm 내의 .. 2025. 3. 18.
Batching 배치 리액트는 성능 최적화를 위해서 여러 상태 업데이트를 한번에 처리한다.이벤트 핸들러나 라이프 사이클 내에서 발생하는 상태 업데이트들을 모아서, 한번의 리렌더링으로 처리하면 불필요한 렌더링 횟수를 줄여준다.이를 통해서 앱이 더 부드럽게 동작할 수 있다.   * 문제점- 동일한 상태를 여러번 업데이트했을 때, 각 업데이트가 독립적으로 반영되지 않고 배치되어 버리면, 의도한 대로 상태가 변화하지 않을 수 있다. 예를 들어const handleClick = () => { setCount(count + 1); // 현재 count 값 사용 setCount(count + 1); // 여전히 이전 count 값 사용};이런 경우에 count는 +2가 아니라 +1 된다.  * 그러면 어떻게 이를 해결할 수 있을까? .. 2025. 3. 18.
React 18 ) useTransition 아까 useActionState에 대해서 언급하였는데, 작동이 안되는 경우가 종종 있다. 예를 들어서, isPending 값이 제대로 업데이트 안되는 경우가 존재했다. ( 아무래도 아직 나온지 얼마 안되어서 그런건가? )  * 두가지 반환값이 존재한다. - isPending : 배열을 반환하는데, 첫번 째 값은 업데이트가 진행중인지 나타내는 boolean 값 - startTransition : 비우선 업데이트를 시작하는 함수  * 사용목적예를 들어서, 사용자가 입력하는 동안 목록 필터링처럼 시간이 좀 걸리는 작업이 있다면 이 작업을 startTransiton 안에 넣어서 실행할 수 있다. 그러면 입력반응은 즉시 이뤄지고, 시간이 걸리는 작업은 백그라운드에서 진행되면서 UI가 멈추지 않는다.  import.. 2025. 3. 18.
React 19 ) useActionState( 구 useFormState ) useFormState는 이전에 React Dom에서 제공했었고 이제는 useActionState로 이름이 바뀌어 제공된다. 목적은 폼의 동작을 쉽게 관리하기 위함이다.  useActionState ( 구 useFormState )const [state, formAction, isPending] = useActionState(fn, initialState, permalink?); * 목적- 폼 제출 ( 이걸 액션이라고 한다 ) 을 호출할 때, 이전 상태와 함께 폼 데이터를 인자로 받아 처리한 후, 그 결과 상태를 관리해준다. * 기능- 폼 제출 시 자동으로 pending 상태를 관리한다.- 서버액션 ( 데이터 업데이트, 검증 등 )의 결과를 상태로 반영하여 이후 렌더링에 활용할 수 있다.- 이전 Cana.. 2025. 3. 18.
도커와 라라벨 도커는 어플리케이션과 그 실행환경을 함께 패키징하여 어디서나 동일하게 실행할 수 있도록 돕는 도구다. 즉, 소프트웨어를 컨테이너라는 독립된 단위로 묶어서, 개발환경, 테스트 환경, 실제 운영환경 간의 차이를 줄여줍니다.   몇가지 주요개념- 컨테이너 Container어플리케이션 실행에 필요한 코드, 라이브러리, 환경 설정 등을 함께 포함하는 가벼운 가상화 단위이다.이는 서로 격리되어 실행되며, 시스템 리소스를 효율적으로 사용할 수 있게 한다. - 이미지 Image컨테이너를 생성하기 위한 템플릿이다. 개발자가 어플리케이션 환경을 정의하면, 이를 기반으로 컨테이너가 만들어진다.  - 도커파일 DockerFile 이미지를 생성하기 위한 설정 파일로 어플리케이션 설치 및 구성에 필요한 명령들을 순차적으로 작성한.. 2025. 3. 14.
일렉트론 #1 index.html - 어플리케이션의 기본 HTML 파일- UI의 구조를 정의한다. - 이 파일은 렌더러 프로세스에서 로드되어 화면에 표시된다.  index.js- 렌더러 프로세스에서 실행되는 js 파일- index.html과 함께 로드되어 UI 동작을 제어한다.- DOM 조작, 이벤트 처리, 프론트엔드 로직을 구현 preload.js- 브라우저 창이 로드되기 전에 실행되는 스크립트- Node.js와 브라우저 환경 모두에 접근 가능- 메인 프로세스와 렌더러 프로세스 간의 안전한 통신을 위해서 사용함- contextBridge api를 통해서 렌더러 프로세스에 선택된 기능을 노출한다.  forge.config.js- electron forge의 구성파일로, 어플리케이션의 빌드, 패키징, 배포 설정을 정의한.. 2025. 2. 24.
저장 프로시저 및 C# 사용 저장 프로시저는 데이터베이스에서 여러 SQL 쿼리를 하나의 함수처럼 묶어두고,이를 필요할 때마다 호출하여 실행할 수 있도록 하는 기능이다. 이를 통해서 코드의 재사용성을 높이고, 네트워크 부하를 줄이고, 데이터 무결성을 유지할 수 있다.   예시1. 단순한 데이터 조회 프로시저CREATE PROCEDURE GetAllEmployeesASBEGIN SELECT * FROM Employees;END;  2. 매개변수를 사용하는 프로시저- 특정 부서의 직원들을 조회하는 프로시저로, 부서 ID를 매개변수로 받는다.CREATE PROCEDURE GetEmployeesByDepartment @DepartmentID INTASBEGIN SELECT * FROM Employees WHERE DepartmentID.. 2025. 2. 20.
특정 카테고리에서 현재 군중이 가장 관심가지는 주제를 알고 싶다면? ( 워드클라우드, KONLPY ) 정치인들은 몰라도 우리같은 시민들은 자신의 정치적 견해를 입 밖으로 잘 내뱉지 않는다. 주로 사람들은 디시인사이드나 FM코리아, 스레드와 같은 커뮤니티에 자신의 정치적 견해를 내뱉곤 한다.  나는 갑자기 특정 기간, 예를 들어서 2월 1일부터 2월 4일까지의 사람들의 주요 관심사가 정확히 어떤 대상에 어떤 비중으로 분포되어있는지 알고 싶어졌다.  글을 긁어오는 방식은 간단하다. 우리가 브라우저로 웹페이지를 보는 것은 해당 url에다가 get 요청을 하는 것과 같은데 코드로 get 요청을 하면 된다. 시각적으로 보는 것만 다를 뿐이지 서버 입장에서는 사실 같은 행동이다. 다만, 다른 것이 있다면 나같이 이렇게 긁어가려는 사람들을 서비스 입장에서는 좋게 보지 않을 것이다. 10000명의 유저가 1번 봐서 나.. 2025. 2. 18.

티스토리툴바