반응형

suno.ai라는 사이트를 통해 3분 이상의 음악을 생성해보았습니다.

하루에 무료로 50 credits이 제공되며, 이는 총 5곡 정도를 작곡할 수 있습니다. 1곡당 1분 정도의 음악이 만들어집니다. 

 

무료 버전인 경우 저작권은 Suno에게 있으며, 유료 회원인 경우 저작권을 가질 수 있는 구조입니다.

 

AI 음악 제작 : https://www.suno.ai/

 

Suno AI

We are building a future where anyone can make great music. No instrument needed, just imagination. From your mind to music.

www.suno.ai

 

반응형

 

이번에 조용히 들을 수 있는 음악을 생성해 보았습니다.

 

https://www.youtube.com/watch?v=imbrwrEn7F8

 

반응형
반응형

현대의 웹과 모바일 애플리케이션 개발에서 데이터 관리는 중요한 측면 중 하나입니다. 

 

전통적인 RESTful API는 오랫동안 데이터를 요청하고 전송하는 표준 방식이었습니다. 

하지만, RESTful API는 여러 엔드포인트에 대한 복잡한 요청, 데이터 오버페칭 및 언더페칭과 같은 문제를 내포하고 있습니다. 

 

이러한 한계를 극복하기 위해 Facebook은 2015년 GraphQL을 공개했습니다. 

 

GraphQL은 데이터 요청과 응답 과정을 더 효율적이고 유연하게 만들어 개발자의 생산성을 크게 향상시킵니다.

 


GraphQL 소개

GraphQL은 클라이언트가 필요한 데이터의 구조를 명확하게 요청할 수 있게 하고, 서버는 정확히 그 요청에 맞는 데이터만 반환합니다. 이는 데이터 오버페칭과 언더페칭을 방지하고, 애플리케이션의 성능을 최적화합니다.

예를 들어, 사용자 정보와 그 사용자의 게시글 제목만을 요청하는 GraphQL 쿼리는 다음과 같이 간단합니다

query {
  user(id: "1") {
    name
    email
    posts {
      title
    }
  }
}

이 쿼리는 사용자의 이름, 이메일, 그리고 게시글 제목만을 반환합니다. 이러한 단순성과 명확성은 GraphQL의 주요 장점 중 하나입니다.

 


주요 개념과 용어

 

GraphQL을 이해하기 위해서는 몇 가지 핵심 개념을 알아야 합니다

  • Schema: 데이터의 모델을 정의하며, 특정 쿼리에 대해 반환되어야 하는 데이터 타입을 명시합니다.
  • Query: 데이터를 읽을 때 사용되며, REST API의 GET 요청과 유사합니다.
  • Mutation: 데이터를 생성, 수정, 삭제할 때 사용됩니다.
  • Resolver: 쿼리나 뮤테이션을 실제 데이터로 해석하는 함수입니다.

예를 들어, 사용자 스키마는 다음과 같이 정의될 수 있습니다

type User {
  id: ID!
  name: String!
  email: String!
  posts: [Post!]
}

 

그리고 사용자의 정보를 요청하는 쿼리는 이렇게 간단해집니다

query {
  user(id: "1") {
    name
    email
  }
}

 


 

GraphQL의 장점

GraphQL의 주요 장점은 데이터 오버페칭과 언더페칭을 방지하며, 애플리케이션의 네트워크 성능을 최적화한다는 점입니다. 

클라이언트는 필요한 데이터만 정확히 요청할 수 있으며, 서버는 요청된 데이터만 반환합니다. 

이는 특히 복잡한 시스템과 모바일 애플리케이션에서 매우 유용합니다.

또한, GraphQL은 타입 시스템을 사용하여 API를 더욱 견고하게 만듭니다. 

개발자는 API를 통해 어떤 데이터를 기대할 수 있는지 명확하게 알 수 있으며, 이는 개발 과정에서의 오류를 줄여줍니다.

 


 

사용 사례

GraphQL은 전 세계 수많은 기업에서 성공적으로 도입되어 사용되고 있습니다. 

예를 들어, GitHub, Shopify, Twitter 등의 기업은 자신들의 API에 GraphQL을 채택하여 개발자 경험을 향상시키고 있습니다. 

이러한 기업들은 GraphQL을 통해 데이터 관리의 복잡성을 줄이고, 개발 효율성을 높이는 데 성공했습니다.

 


 

기본 GraphQL 서버 구축

GraphQL 서버를 구축하는 것은 생각보다 간단합니다. 

예를 들어, Node.js와 Apollo Server를 사용하여 간단한 GraphQL 서버를 설정할 수 있습니다

const { ApolloServer, gql } = require('apollo-server');

const typeDefs = gql`
  type Query {
    hello: String
  }
`;

const resolvers = {
  Query: {
    hello: () => 'Hello, world!',
  },
};

const server = new ApolloServer({ typeDefs, resolvers });

server.listen().then(({ url }) => {
  console.log(`🚀 Server ready at ${url}`);
});

 

이 예제는 매우 간단한 GraphQL 서버를 보여줍니다. 

여기서는 하나의 쿼리만 있지만, 실제 애플리케이션에서는 사용자 정의 타입, 복잡한 쿼리 및 뮤테이션 등을 추가할 수 있습니다.

 


 

GraphQL 도구 및 리소스

GraphQL을 시작하는 데 있어 도움이 될 수 있는 다양한 도구와 리소스가 있습니다. 

Apollo Client는 클라이언트 사이드에서 GraphQL을 쉽게 사용할 수 있게 해주며, GraphQL Playground는 쿼리를 테스트하고 문서화하는 데 유용합니다. 

또한, 공식 GraphQL 웹사이트와 GitHub에서는 풍부한 학습 자료와 커뮤니티를 제공하고 있어, GraphQL에 대한 깊은 이해를 돕습니다.

 


 

최신 동향과 자원

  • GraphQL 공식 웹사이트 - GraphQL에 대한 공식 문서와 자습서, 스펙 등이 포함된 웹사이트
  • Apollo GraphQL - GraphQL 개발에 도움이 되는 도구와 자료가 제공되는 공식 웹사이트
  • GitHub GraphQL API - GitHub에서 사용하는 GraphQL API에 대한 문서와 예제
  • GraphQL Weekly Newsletter - GraphQL과 관련된 주간 소식과 리소스를 제공하는 뉴스레터
  • GraphQL Summit - GraphQL 커뮤니티 및 개발자와의 연결 기회를 제공하는 행사 정보

 

GraphQL은 현대 애플리케이션 개발에서 데이터를 관리하는 새로운 방식을 제시합니다. 

그것은 개발자에게 더 큰 유연성과 효율성을 제공하며, 애플리케이션의 성능을 개선합니다. 

GraphQL의 커뮤니티는 지속적으로 성장하고 있으며, 이 기술은 앞으로도 많은 발전을 이룰 것으로 기대됩니다. 

반응형
반응형
구글 플레이 스토어 개발자 계정 등록 방법에 대한 설명
개발자 계정 등록 비용 US$25



구글 플레이 콘솔
로그인

https://developer.android.com/distribute?hl=ko

https://developer.android.com

 

우측 상단 로그인 텍스트 링크를 통해 개발자로 등록할 google 계정 로그인

 

로그인 완료 후 "Play Console 로그인" 버튼 클릭이나 https://play.google.com/console?hl=ko 페이지로 접속

 


 

Play Console 개발자 계정 만들기


Step 1) 계정 유형

https://play.google.com/console

 

계정 유형 (기관/단체, 개인)에 맞게 시작하기 ->  버튼 클릭 후 아래 이미지 순서로 진행

하단 설명부터는 개인 계정 유형에 맞춰 설명 진행

 

 

Step 2) 필요한 항목

개발자 계정을 만드는데 필요항 항목 체크

 

 

Step 3) 개발자 이름

개발자 이름 등록

 

Step 4) 결제 프로필

결제 프로필 연결을 통한 본인 인증 진행

 

Play 개발자 등록을 위해 결제 프로필 연결을 하여 본인 인증 진행 필수 

결제 프로필 만들기 또는 선택 클릭

 

결제 프로필 선택 팝업

 

 

결제 프로필을 선택하세요. 라는 팝업창이 뜨게 되며,

    - 기존에 등록된 결제 프로필이 있을 경우 프로필 항목 선택

    - 등록된 결제 프로필이 없을 경우 "새 결제 프로필 만들기" 선택

 

 

Step 5) 공개 개발자 프로필

외부 사용자에게 노출되는 개발자 프로필 정보를 입력하는 단계

공개 개발자 프로필 등록

 

 

법적 이름, 국가/지역이 현재 개발 등록자 정보와 일치한지 확인

사용자가 문의할  때 사용될 이메일 주소 입력 (개인 개발자의 경우 개인이 사용하는 이메일 작성) 후 이메일 주소 인증 진행

 

 

Step 6) 내 정보

Play Console 및 Android를 사용한 경험이 있는지, 보유한 웹 사이트가 있는지 등의 정보등을 입력하는 단계

외부 사용자에게 노출되는 내용은 아니며 Google에서 수집할려는 정보

내 정보 입력

 

 

항목에 맞춰 입력한 후 "다음" 버튼 클릭

 

Step 7) 앱 개발 계획

향후 앱 개발 계획에 대한 설문을 입력하는 단계

앱 개발 계획 입력

항목에 맞춰 입력한 후 "다음" 버튼 클릭

 

 

Step 8) Google에서 연락하는 방법

Google으로 부터 연락을 받는 것을 대비하여 필요한 항목을 입력하는 단계

Google에서 연락하는 방법 입력

 

연락처 전화번호 항목에서는 사용중인 휴대폰 번호를 입력하고 문자 인증 필수

 

 

Step 9) 약관 동의

필수 약관을 안내받고 동의하는 단계

 

필수 항목을 체크하고 "계정 생성 및 결제" 버튼 클릭

 

 

마지막 단계로 신용카드 및 체크카드를 추가하여 US$25를 결제하시면 개발자 등록 신청이 완료됩니다.

 

 

이후 구글에서는 개발자 등록 신청서를 검토한 후 승인 여부를 알려주게 됩니다.

 


등록이 승인되면 구글 플레이 스토어에서 앱을 출시할 수 있으며, 
개발자 등록 후에는 개발자 콘솔 (https://play.google.com/console)에서 앱을 업로드하고 관리할 수 있습니다.

 

위 내용과 다른 부분이 있으면 언제든지 피드백 부탁드리겠습니다.

반응형
반응형

Visual Studio Code

앱 생성

  1. VS Code 실행
  2. View > Command Palette… 선택
  3. “flutter”을 입력하고 Flutter: New Project 선택
  4. Application 선택
  5. 새로운 프로젝트 디렉토리를 생성하고 해당 디렉토리 선택
  6. 프로젝트명 입력
  7. 프로젝트 생성이 완료되면, main.dart 파일이 나타남

 

앱 실행

  1. VS Code 오른쪽 하단 상태바에서 실행할 Device 영역 클릭
  2. 실행할 가상 Device 선택
  3. F5 또는 Run > Start Debugging 선택
  4. “Start iOS Simulator” 선택시 가상의 iOS 화면이 표시되고 해당 프로젝트 앱이 실행
  5. main.dart 내부 코드를 변경하고 Save All을 할 경우 iOS Simulator에 바로 반영

앱실행 1 이미지
앱실행 - 1) 이미지
앱실행 - 2) 이미지
앱실행 - 4) 이미지

 

Android Studio and IntelliJ

  • Flutter와 Dart 플러그인 설치
    1. Android Studio 실행
    2. Preferences > Plugs 선택
    3. Flutter 선택하고 install 클릭
    4. Android Studio 재실행
  •  
반응형
반응형

Visual Studio Code

Flutter와 Dart 플러그인 설치

  1. VS Code 실행
  2. View > Command Palette… 선택
  3. “install”을 입력하고 Extension: Install Extensions 선택
  4. 확장 검색 필드에서 “flutter”를 입력하고 목록에서 “Flutter”를 선택하고 Install 클릭 (”Dart” 플러그인도 같이 설치됨)

Flutter Doctor로 설정 확인

  1. View > Command Palette… 선택
  2. “doctor”를 입력하고 Flutter: Run Flutter Doctor 선택
    • SDK 선택하라는 문구가 오른쪽하단에 보여질 경우
    • flutter/bin 디렉토리 경로를 선택해주면 해결

 

Android Studio and IntelliJ

  • Flutter와 Dart 플러그인 설치
    1. Android Studio 실행
    2. Preferences > Plugs 선택
    3. Flutter 선택하고 install 클릭
    4. Android Studio 재실행
반응형
반응형

macOS (Apple Silicon) 기준으로 설치 방법을 설명합니다.

 

참고 사이트 : https://docs.flutter.dev/get-started/install/macos

 

macOS install

How to install on macOS.

docs.flutter.dev

 

Apple Silcon Mac Resetta 번역 환경 수동 설치

$ sudo softwareupdate --install-rosetta --agree-to-license

 

Flutter SDK 받기

# flutter 경로에 도구 추가
$ export PATH="$PATH:[PATH_OF_FLUTTER_GIT_DIRECTORY]/bin"

# flutter/bin 디렉토리가 PATH 에 있는지 확인
$ echo $PATH

# 명령어를 사용할 수 있는지 체크
$ which flutter

 

종속 항목을 확인하고 설치

  • 소프트웨어에 추가할 종속 항목을 자동으로 설치
  • 굵은 텍스트로 표시된 항목에 대해서 다시 확인해보고 안내 메세지에 맞게 다시 진행
$ flutter doctor

 

iOS 설정

  • 엑스코드 설치 그리고 새로 설치된 Xcode 버전 사용하도록 명령
$ sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
$ sudo xcodebuild -runFirstLaunch

 

iOS 시뮬레이터 설정

  • 시뮬레이터 찾기
$ open -a Simulator

 

Android 설정

⚠️ Flutter는 Android 플랫폼 종속성을 제공하기 위해 Android Studio의 전체 설치에 의존합니다. 그러나 여러 편집기에서 Flutter 앱을 작성할 수 있습니다.

 

Android Studio 설치

$ flutter doctor

 

Android 에뮬레이터 설정

  • Android Studio 실행
  • “More Actions” 선택
  • “Virtual Device Manager” 선택
  • 장치를 선택
  • 에뮬레이션할려는 Android 버전의 시스템 이미지 하나 이상 선택
  • AVD (Android Virtual Device) 구성을 확인하고 마침

 

Android 라이센스 동의

$ flutter doctor --android-licenses
  • “Android sdkmanager not found. Update to the latest Android SDK and ensure that the cmdline-tools are installed to resolve this.” 에러 발생시
    • Android Studio 실행
    • “More Actions” 선택
    • “SDK Manager” 선택
    • Apprearance & Behavior > System Settings > Android SDK 항목 선택
    • SDK Tools 탭에서 “Android SDK Command-line Tools (latest) 체크
      • 위 flutter 명령어 재 실행

간단한 Flutter 앱 생성 및 실행

# 새로운 Flutter 생성
$ flutter create my_app

# 디렉토리 이동
$ cd my_app

# 시뮬레이터에서 앱 실행
$ flutter run
반응형
반응형

public static bool CheckCpIdenti(string cpIdenti)
{
            cpIdenti = cpIdenti.Replace("-", "");

            if (cpIdenti.Length != 10)
            {
                return false;
            }

            int sum = 0;
            string checkNo = "137137135";

            // 1. 각각의 자리에 1 3 7 1 3 7 1 3 5 를 곱한 합을 구한다.
            for (int i = 0; i < checkNo.Length; i++)
                sum += (int)Char.GetNumericValue(cpIdenti[i]) * (int)Char.GetNumericValue(checkNo[i]);

 

            // 2. 마지막에서 두번째 숫자에 5를 곱하고 10으로 나누어 나온 몫을 더한다.
            sum += (int)Char.GetNumericValue(cpIdenti[8]) * 5 / 10;

 

            // 3. 매직키인 10로 나누어 나머지만 취한다.
            sum %= 10;

 

            // 4. 매직키인 10에서 나머지를 뺀다. (단 나머지가 0이 아닐경우)
            if(sum != 0)

     sum = 10 - sum;

 

            // 5. 이숫자가 사업자등록번호 마지막 자리의 숫자와 일치하면 정상적인 사업자등록번호이다.
            if (sum != (int)Char.GetNumericValue(cpIdenti[9]))
                return false;
            else
                return true;
}

반응형
반응형

var popup;

$("#btnPopup").click(function () {
           if (popup == undefined) {
                    popup = window.open("Popup.aspx", "Test", "top=10, left=20, width=600, height=600");
           }
           else {
                    if (popup.closed) {
                        popup = window.open("Popup.aspx", "Test", "top=10, left=20, width=600, height=600");
                    }
                    else {
                        alert("이미 팝업창이 떠있습니다.");
                    }
          }
});

 

반응형

+ Recent posts