Computer Language 40

[Matlab] ode45와 자세제어

비행 동역학에서 과제가 나왔다. ode45를 이용해서 자세 제어 시뮬레이션을 돌리라는 건데 .. 기초가 없는 나는 수많은 질문이 떠올랐다. 더보기ode가 뭔데 ? ㄴ 상미분 방정식 ode를 왜 쓰는건데? ㄴ 적분해서 위치 추정하려구 ode45는 매트랩에서 어떤 기능을 하는 함수? 라이브러리? 뭔데 ? ㄴ 솔버 함수 왜 자세제어에서 ode를 쓰는건데?ㄴ ode는 사실상 적분을 하는 함수라 초기값과 속도 벡터를 적분하여 위치를 구하는 것임 ode의 결과값으로는 뭐가 나오는데 ? 파라미터는 뭔데 ? ㄴ 결과는 벡터로 반환하고, 초기값으로 넣어줬던 벡터를 적분한 값ode하고 45는 왜붙는건데 ? 개발자가 왜 이런 이름 붙였음 ?ㄴ 이건 그냥 4차 미방이라 그런듯ODE의 개념, matlab의 ode45 솔버 함수..

Computer Language 2025.10.04

[React] 리액트 이벤트 캡처링

💥 FullCalendar작업을 하고 있는데 발생한 문제  이벤트가 부모 > 자식에게 적용되지 않는다 ! 날짜를 선택했을 때, 적용되는 이벤트(dateClick) 작성해두었었다. 그런데 날짜를 선택하면 잘 적용이 되었지만, 날짜 안에 자식 요소인 일정이 들어간 경우는 적용이 되지 않았다..즉, 일정(하위요소)가 추가되면 상위 요소에 적용되던 이벤트의 가용범위가 너무 작아진다는 문제 발생 !!  ✔️ 해결 방법 문제를 해결하기 위해 GPT 교수님께 여쭤보니 '이벤트 캡처링' or '이벤트 버블링'을 사용하라고 하심 !  * 이벤트 캡처링 : 이벤트가 최상위 부모 요소에서 시작해 이벤트가 발생한 요소까지 내려온다. * 이벤트 버블링 : 이벤트가 발생한 요소에서부터 다시 최상위 부모 요소까지 올라간다.  이..

[React] 리액트 App.js 화면에 꽉 차게 설정

💥 트러블 슈팅 문제점 :   개발 중 굉장히 거슬리는 문제 하나가 발생하였다..  맨 위 헤더 컴포넌트의 border를 설정했는데.. 저렇게 hr처럼 나온다. 확인해보니 화면에 꽉 차지 않는 이유 때문 !   아니 왜 App.js가 화면에 꽉 차지 않지?  그래서 style에 width : 100%도 추가해주었는데.. 되지 않았음 😭    하지만 문제는 생각보다 간단히 해결된다. 해결방법 - 기본 스타일 초기화브라우저의 기본 스타일이 영향을 미칠 수 있다고 한다. CSS 리셋이나 노말라이즈 CSS를 사용하여 기본 스타일을 초기화하자 !  npm install normalize.css // index.jsimport 'normalize.css'; 이렇게 간단하게 해결 가능 ~

[React] 하단 네비게이션 만들기

만든지는 한~ 참 되었지만 까먹기 전에 얼른 써야겠다  ✅ 하단 네비 커스텀 요구사항 1. 클릭 시, 페이지 이동(기본)2. 페이지에 맞는 Footer메뉴 선택 3. 페이지 바닥에 고정 👩🏻‍💻 하단 네비 만드는 과정 1. App.js에 페이지 Router 생성 기본적으로 페이지를 이동하기 위해서는 페이지 라우팅이 필요하다. 하단 네비에서 react-router-dom의 Link를 사용할 계획이었기에 App.js에 이러한 라우터를 추가해주었다.  } /> }/> }/> }/> }/> }/>    2. Footer.jsx 생성 - Link로 경로를 주고, 메뉴들을 생성해주었다. impo..

[FE] 리액트 CI/CD (1) AWS S3에 SPA 올리고 Github-actions으로 자동 업데이트

이번주에 배포를 처음해본 프론트엔드 쌉 주니어입니다. 이번 편은 저의 첫 배포에서의 시행착오와 발생했던 에러들에 대해서 담아볼까 합니다. 목차1. IAM 유저 생성 2. S3 버킷 생성 3. Github-actions 연결 1. IAM 유저 생성 1 - 1. S3, AWS Cloud 사용을 위한 Access 추가 2. S3 버킷 생성 ** 가비아에서 도메인 구매 후 연결할 예정이시라면, 꼭 도메인 이름과 버킷 이름을 통일하시길 바랍니다.. ( EX. 버킷이름 - domain.com ) 2 - 1. 버킷 생성 - ACL활성화 > 버킷 소유자 선호 - 퍼블릭 액세스 차단 해제 2 - 2. 정적 호스팅 설정 생성된 버킷 속성 탭(properties)에서 정적 호스팅(Static website ho..

Computer Language 2024.06.05

[AWS] S3과 버킷

아마존 S3란?- Amazon Simple Storage Service(Amazon S3)는 확장성, 데이터 가용성, 보안 및 성능을 제공하는 객체 스토리지 서비스 - S3는 인터넷을 통해 어디서나 대규모 데이터를 저장하고 검색할 수 있는 매우 확장 가능하고 내구성이 뛰어난 스토리지 솔루션을 제공한다.  S3의 주요 기능과 특징 1. 객체 스토리지 객체 스토리지란 객체라고 하는 비정형 형식으로 데이터를 저장하고 관리하는 기술이다  - S3는 파일(객체)을 저장하고 각 파일은 고유한 키를 가진다.- 객체는 메타데이터, 데이터, 키로 구성된다. 2. 버킷버킷은 Amazon S3에 저장된 객체에 대한 컨테이너 - 버킷은 S3에서 데이터를 조직화하는 기본 단위이며 객체는 버킷에 저장된다.- 각 버킷은 고유한 이..

Computer Language 2024.05.19

[React] FontAwesome 사용하기

(내가 잘 까먹어서 올려두는) 리액트에서 폰트 어썸 사용하기 폰트어썸을 모를땐 파일에 jpg를 추가해서.. 하나씩 넣었다. 블로그에 올리고 img주소를 복붙했다. 이 얼마나 고된 작업이던가 하지만 폰트어썸을 만나고 난 뒤, 내 인생은 360도 변했다. 폰트어썸.., 나의 빛(까진 아님), 폰트어썸, 나의 구원 ! 어쨌든 정말 간편하다! 1. fontAwesome설치 $ npm i --save @fortawesome/fontawesome-svg-core $ npm i --save @fortawesome/free-solid-svg-icons $ npm i --save @fortawesome/react-fontawesome 2. FontAwesome.jsx 파일 만들기 import { library } fro..

[C#] 간단한 문장 검사 프로그램

나같은 SSAP초보 인턴은 스타트업이 아닌 이상 문서 처리 작업을 더 많이 할 것이다. (아닐 수도 있다.) 그런데 단순 반복 문서 작업을 하던 중.. 문서만 보고있기에 심심하기도하고 눈알이 빠질 것 같아서 컴퓨터의 힘을 빌리기로 해 보았다. 요구사항 DD-MM-YY HH:MM:SS, Order, ?, Type, ?, Base, ?, 형태가 맞는지 다시 한번 확인해주세요. (회사가 공군이랑도 관련이 있고 아무래도 정보 노출에 민감하여 ?로 표시한 부분은 정보의 형태로 보면 된다.) 그런데 확인해야할 파일이 대락 50개에 한 파일당 평균 40줄 정도는 되어서 .. 프로그램을 작성해보았다. using System; class CheckInfo { static void Main(string[] args) { ..

[C#] .NET(닷넷)이란

.NET 이란? Microsoft에서 지원하는 무료 오픈 애플리케이션 플랫폼 사실 이 문장만 들으면 아 그렇구나 ~ 라고 할 수는 있지만 뭔말인지 모르겠다. 플랫폼이 한두개인가 ? 그래서 찬찬히 뜯어보자! C#과 .NET은 뗄 수 없는 사이니까 .. ✔️ 애플리케이션 개발 다양한 플랫폼에서 다양한 종류의 응용 프로그램을 개발할 수 있도록 도와주는 강력한 프로그래밍 프레임워크인 .NET은 말 그대로 크로스(cross) 개발 플랫폼이다. C#, Visual Basic, F# 등의 언어를 사용하여 웹 애플리케이션, 데스크톱 애플리케이션, 모바일 애플리케이션 등 다양한 종류의 응용 프로그램을 개발할 수 있다. * 플랫폼 : 소프트웨어가 실행되는 환경 * 프레임워크 : 소프트웨어 개발을 위한 구조와 도구를 제공하..

[React] Snippets/ 리액트 단축키 사용법

1. Sinppets란 Sinppets : 코드 조각이나 코드 템플릿 소프트웨어 개발에서 일정한 패턴이나 반복되는 코드를 빠르게 작성할 수 있도록 도와주는 기능 2. 사용 방법 리액트 개발을 할 때 효율적으로 작업하기 위해 사용하는 단축키가 몇가지 있다. Visual Studio Code에선 "ES7 React/Redux/GraphQL/React-Native Snippets"이라는 확장팩을 설치해서 사용할 수 있다. 확장팩 설치 > react sinppets 검색 3. 자주쓰는 단축키 1. 함수형 React 컴포넌트 생성 - rfc // rfc import React from 'react' export default function Home() { return ( Home ) } 2. 기본적인 클래스형 ..