믹아의 개발일기

Warning: A component is changing an uncontrolled input of type undefined to be controlled. Input elements should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component.

인풋창을 입력하는 순간 이런 에러가 뜨더라.. input value 로 undefined 가 들어가서 그런듯하다

const [ip, setip] = useState();
<input onChange={setip} value={ip} />

대략 내 상황..

const [ip, setip] = useState(''); // 해결방안 1 : 초기값을 '' 로 
<input onChange={setip} value={ip || ''} />  <!-- 해결방안 2 : 값이 undefined 일경우 value 를 ''로 --!>

이렇게 해결

const GetListFromDB = async () => {
    const scan = {
        TableName : config.aws_table_name
    }
    const ret = await dynamoDB.scan(scan).promise();
    console.log(ret);
}

{
  Items: [ { idx: 'List', datalist: [] } ],
  Count: 1,
  ScannedCount: 1
}

뒤에 promise() 를 붙여주니 바로 데이터를 가져올수 있더라

이번엔 AWS 의 DynamoDB를 한번 사용해보려고 한다.

일단 AWS의 사용자 키가 필요한데 없다면 mik-a.tistory.com/59 이 글을 보고 만들수있다.

1. 테이블 만들기

ap-northeast-2.console.aws.amazon.com/dynamodb/home?region=ap-northeast-2#

테이블을 만들었다.

nodejs 로 넘어가서,

npm install aws-sdk

aws sdk 를 사용하기위한 모듈을 설치해준다

테이블에 데이터를 넣어보자

const AWS = require('aws-sdk');

const tableName = 'Test';
const key = {
        accessKeyId : '<Access Key>', // 개인 Access key 를 넣어준다.
        secretAccessKey: '<Secret AccessKey>',
        region : 'ap-northeast-2'
    };

AWS.config.update(key);
const dynamoDB = new AWS.DynamoDB.DocumentClient();

const put = {
    TableName : tableName,
    Item : {
        idx : 'idx001',
        data : 'data1',
        data2 : 'data2'
    }
}
dynamoDB.put(put, (e,d) => {
    console.log(e,d)
});

key 의 region 은

aws 의 지역을 보면 된다.

위의 코드를 실행하고, aws 의 dynamodb 테이블을 보자

데이터가 들어가있는걸 확인할수 있다.

추가로 2개의 데이터를 더 추가했다.

이제 하나의 데이터를 찾아보자

const AWS = require('aws-sdk');

const tableName = 'Test';
const key = {
        accessKeyId : '<Access Key>',
        secretAccessKey: '<Secret AccessKey>',
        region : 'ap-northeast-2'
    };

AWS.config.update(key);
const dynamoDB = new AWS.DynamoDB.DocumentClient();

const query = {
    TableName : tableName,
    KeyConditionExpression : 'idx = :i',
    ExpressionAttributeValues : {
        ':i' : 'idx001'
    }
}
dynamoDB.query(query, (d) => {
    console.log(d);
})

{
  Items: [ { data2: 'data2', data1: 'data1', idx: 'idx001' } ],
  Count: 1,
  ScannedCount: 1
}

테이블의 모든 데이터를 가져와보자

const AWS = require('aws-sdk');

const tableName = 'Test';
const key = {
        accessKeyId : '<Access Key>',
        secretAccessKey: '<Secret AccessKey>',
        region : 'ap-northeast-2'
    };

AWS.config.update(key);
const dynamoDB = new AWS.DynamoDB.DocumentClient();

const scan = {
    TableName : tableName,
}

dynamoDB.scan(scan, (e,d) => { 
    console.log(d);
})

{
  Items: [
    { data2: 'data2', data1: 'data1', idx: 'idx002' },
    { data2: 'data2', data1: 'data1', idx: 'idx003' },
    { data2: 'data2', data1: 'data1', idx: 'idx001' }
  ],
  Count: 3,
  ScannedCount: 3
}

테이블의 데이터중 하나를 수정(업데이트) 해보자

const AWS = require('aws-sdk');

const tableName = 'Test';
const key = {
        accessKeyId : '<Access Key>',
        secretAccessKey: '<Secret AccessKey>',
        region : 'ap-northeast-2'
    };

AWS.config.update(key);
const dynamoDB = new AWS.DynamoDB.DocumentClient();

const update = {
    TableName : tableName,
    Key : {idx : 'idx001'},
    UpdateExpression : 'set data1 = :d1, data2 = :d2',
    ExpressionAttributeValues:{
        ":d1": 'newdata1',
        ":d2": 'newdata2'
    },
}

dynamoDB.update(update, (e,d) => {
    console.log(e,d)
})

이렇게 간단하게 DynamoDB 를 사용해봤다.

지금까지 MongoDB만 사용하다가 DynamoDB를 처음써보니 아직 익숙하지가 않은데..

쓰다보면 익숙해지겠지 뭐..

AWS 의 서비스들을 사용하기위해 액세스 인증 키를 생성해보려고 한다.

https://console.aws.amazon.com/iam/home#/home

위의 주소로 들어간다.

여기서 얻은 키는 다시 볼수없으니 잘 저장해두자.

이제 여기의 Access key ID 와 Seceret access key 로 aws의 여러 서비스를 사용해보자

npm 에 패키지를 올릴려고

npm publish 를 했는데

npm ERR! code E403

npm ERR! 403 403 Forbidden - Put [패키지 주소] - Forbidden

npm ERR! 403 In most cases, you or one of your dependencies are requesting

npm ERR! 403 a package version that is forbidden by your security policy.

이런 에러가 뜨더라...

npm 회원가입할 때 이메일 인증을 안해서 뜨는거였다. 이메일 인증하고 해결.. ㅎㅎ;;;