미새문지

android studio에서 새 프로젝트를 클릭하면 어떤 언어로 프로젝트를 구현할건지 선택하는 창이 나온다.flutter를 선택하고 다음버튼을 누르면 프로젝트 설정 창이 뜨는데,intelliJ에서 자주 보던 비주얼이다. 둘이 다른 환경인데 일부러 비슷하게 만든걸까 프로젝트 이름과 프로젝트 설명을 작성하고 하단에 플랫폼 선택이 있는데 앱 방식으로 볼 것이기 때문에 ios와 android만 체크해서 생성해준다. 프로젝트 생성 시 처음 보이는 화면이다.lib폴더의 main.dart가 프로젝트 기본 코드이며, 제대로 작동하는지 확인하는 역할이다.상단에 초록 삼각형인 실행버튼을 클릭하면 브라우저에 해당 코드에 맞는 페이지가 뜬다. 해당 코드 페이지이며 하단의 +버튼 클릭 시 카운트가 증가하는 페이지이다.이제 f..

먼저 flutter는 구글이 개발한 오픈 소스 UI 소프트웨어 개발 키트(SDK)이며, 하나의 코드베이스로 iOS, Android, 웹, 데스크탑(Windows, macOS, Linux) 애플리케이션을 개발할 수 있도록 돕는 크로스 플랫폼 개발 프레임워크이다.크로스 플랫폼은 두 개 이상의 플랫폼을 지원하는 것을 뜻하며 flutter는 애플의 iOS와 구글의 안드로이드를 하나의 코드로 개발할 수 있기 때문에 점점 각광받고 있다.초기 출시에는 앱 개발을 목적으로 나온거 같으나 근래에는 웹도 개발할 수 있게 업데이트 됐다고 한다.flutter의 주요 특징은 Dart 언어로 개발하며, 위젯을 통해 화면을 구성하고 커스터마이징할 수 있다. flutter 장점하나의 코드베이스로 멀티플랫폼 지원: flutter는 한..

chart.js는 데이터를 시각화하기 위해 사용하는 차트 라이브러리이다.차트를 직접 작성해도 되지만, 기본적으로 여러 종류의 차트가 들어있는 chart 라이브러리를 사용하는게 편리하고 좋기 때문에 자주 사용된다.리액트에선 주로 chart.js와 react-chartjs-2를 같이 쓰는데, 이는 차트를 사용하기 편하게 컴포넌트 형식으로 만든 코드이다. chart.js의 차트 종류에는 line, bar, radar, pie, bubble 등의 수많은 차트가 존재하며, 사용하고 싶은 파트를 react-chartjs-2로 가져와 사용하면 된다.chart.js 기본 코드import React from "react";import { Line } from "react-chartjs-2";import { Chart ..

SSL(Secure Sockets Layer) SSL은 인터넷에서 데이터를 안전하게 주고받기 위한 암호화 프로토콜이며, 웹 브라우저와 웹 서버 간에 전송되는 데이터를 보호하여 도청, 위조, 변조 등의 공격으로부터 데이터를 안전하게 보호한다.SSL은 90년대에 개발되어 현재 SSL 3.0까지 발전되었다. 최근의 SSL은 더 발전된 TLS(Transport Layer Security)로 대체되었지만, 여전히 SSL이라는 용어로 사용되고 있다.SSL의 주요 기능데이터 암호화(Encryption)SSL을 통해 전송되는 모든 데이터는 암호화되는데, 데이터가 인터넷을 통해 전송될 때, 중간에서 데이터를 가로채더라도 해독할 수 없기 때문에 전송되는 정보의 기밀성이 유지된다.예시로 사용자가 웹사이트에서 결제 정보를 입..

요 근래 cs에 대한 지식이 많이 부족한 것 같아 정처기도 공부할 겸 문제풀이를 진행했다.오랜만에 풀어봐서 아슬아슬하게 커트라인이 나왔으나 좀만 공부하면 필기는 딸 수 있을 것 같다. CMM 모델능력 성숙도 모델(CMM, Capability Maturity Model)은 소프트웨어 개발 및 관리 프로세스를 평가하고 개선하기 위한 프레임워크이며, 조직의 프로세스 성숙도를 다섯 가지 단계로 나눌 수 있다.초기 단계 (Initial): 프로세스가 비공식적이고 예측 불가능하며, 성공이 개인의 노력에 의존한다.관리 단계 (Managed): 기본적인 프로젝트 관리 프로세스가 도입되어 있으며, 일정과 비용이 관리되지만, 여전히 프로세스는 불완전하다.정정의 단계 (Defined): 모든 프로세스가 문서화되고 표준화되어..

소프트웨어 생명주기(SDLC, Software Development Life Cycle) 모델 소프트웨어 생명주기는 소프트웨어 개발의 전체 과정을 체계적으로 관리하기 위한 프레임워크이며, SDLC는 소프트웨어 프로젝트의 계획, 개발, 유지보수 및 폐기에 이르는 모든 단계를 포함한다. SDLC 단계요구사항 분석(Requirements Analysis): 고객이나 사용자의 요구사항을 수집하고 분석하여 소프트웨어가 해결해야 할 문제와 기능을 명확히 정의한다.설계(Design): 요구사항을 바탕으로 소프트웨어의 전체 구조와 세부적인 시스템 및 모듈 설계를 수행한다.구현(Implementation): 설계에 따라 실제 코드를 작성하고, 소프트웨어를 개발한다.테스트(Testing): 구현된 소프트웨어가 요구사항을 ..

모듈 번들러모듈 번들러는 현대 웹 개발에서 매우 중요한 도구로, 모듈화된 자바스크립트 파일들을 하나의 최적화된 파일로 묶는 역할을 한다.여기서 모듈이란, 여러 기능들에 관한 코드가 모여있는 하나의 파일이며, 이를 서로 조합해 더 큰 프로그램을 만들 수 있다. 모듈의 사용처유지보수성 : 기능들이 모듈화가 잘 되어있다면, 의존성을 그만큼 줄일 수 있기 때문에 어떤 기능을 개선한다거나 수정할 때 훨씬 편하게 할 수 있다.네임스페이스화 : 자바스크립트에서 전역변수는 전역공간을 가지기 때문에 코드의 양이 많아질수록 겹치는 네임스페이스가 많아질 수 있지만, 모듈로 분리하면 모듈만의 네임스페이스를 갖기 때문에 그 문제가 해결된다.재사용성 : 똑같은 코드를 반복하지 않고 모듈로 분리시켜서 필요할 때마다 사용할 수 있다..

넥스트를 처음 설치하게 되면 프로젝트 폴더의 구조는 이렇게 되어있다. app 폴더는 넥스트의 App Router 기능을을 사용하여 페이지와 라우트를 구성한다. page.tsx 파일은 해당 파일이 각 페이지의 기본 파일이며, 이 파일이 루트 경로(/)에 해당한다. 넥스트는 app폴더에서 page.tsx파일을 페이지로 인식하고, 자동으로 라우팅해준다. layout.tsx 파일은 해당 파일은 모든 페이지에 공통으로 적용되는 레이아웃을 정의하는데 예를 들어, 헤더, 네비게이션 바, 푸터 등모든 페이지에 들어가는 공통 컴포넌트를 정의할 수 있다. page.module.css 파일은 해당 페이지와 관련된 CSS 파일이며, 모듈 CSS 방식으로 컴포넌트에 스타일을 적용할 수 있다. css파일로 작성하던 css 파일 ..