bootstrapVue + Vue.js + node.js + mongoDB : 2

1. 

Object.assign() 으로 얕은 복사 test 성공 

= 를 사용해서 복사하니까 기존 object 도 바뀌어서 시도해보게 됨. 

 

2. 

이 녀석이 공백을 스스로 없애버렸다. -> 공백까지 문자열로 인식할 수 있도록 한다. 

: 이 부분은 나중에 하자. 

 

3. 

현재는 aws check connection 시, ec2 instance 를 가져와서 확인하고 있다. 

-> check connection 과 관련 data 를 가져오는 기능을 위한 sdk 를 따로 사용해야 한다고 생각. 

access key 와 secret key, region 등의 정보만을 가지고 connection check 가 가능한 sdk 를 찾아보기로 함. 

 

이건가 싶은 것) client-connect

https://npm.io/package/@aws-sdk/client-connect

-> 이게 아닌 것 같다. 

 

하고자 하는 것) Access Key 와 Secret Key 로 credential permission 을 test 하는 AWS SDK

https://stackoverflow.com/questions/38254107/how-can-i-check-if-the-aws-sdk-was-provided-with-credentials

-> AWS SDK for JavsScript v2 로 알려주고 있다. 

 

AWS SDK for JavaScript v2 와 v3 의 차이점 : 아직 잘 모름. 

v3 를 쓰는 방향으로 가는 것이 좋다. 

v2에 해당하는 api 

 

credential-providers

https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/modules/_aws_sdk_credential_providers.html#aws-sdkcredential-providers

 

4.

credential 부터 찾아보고, 다른 AWS SDK 를 생각해보려고 했는데, 그냥 다른 것부터 하자.

 

5. 

JSON.stringfy()

-> coverts a JavaScript object or value to a JSON string 

object 나 value 를 string 으로 

 

JSON.parse()

-> parses a JSON string, constructing the JavaScript value or object described by the string

string 을 object 나 value 로 

 

6. 

mongoDB upsert 를 못하고 있었는데, 해결해보기로 함. (이걸 못해서 전체 delete 하고 insert 하는 등의 처리를 했었는데, 정말이지 이건 아닌 것 같다. )

< 안되는 이유 >

case1) 매개변수 주는 게 잘못되었다. 

findOneAndUpdate 가 매개변수 3개인 것과 4개인 것이 있는가보다. -> upsert 를 하기 위해서는 매개변수 4개인 것을 써야함.

 

upsert: true 를 줄 때, returnNewDocument: true 로 같이 줘서 같은 document 가 두 번 들어가는 일을 막아야 한다. 

https://docs.mongodb.com/manual/reference/method/db.collection.findOneAndUpdate/#examples

 

7.

MongooseError: Query was already executed: awsVer3Data.findOneAndUpdate({ credentialName: 'ec2instances...

-> 이걸 해결하기 위해서 .clone() 을 뒤에 붙였다. 

 

8. 

버튼 하나 클릭 시, backend api 를 여러개 호출해와야 하는 상황이 있었다. 

idea1)

-> axios multiple request 가 있다고 한다. 

axios.all()

Axios.all() VS Promise.all()

 

idea2)

JavaScript 에서는 함수를 배열에 넣는 것이 가능. 

반복문으로 실행하는 방법 

-> 되긴 된다

되긴 되는데, upsert 옵션 사용 시, 같은 document 가 2번씩 insert 되는 문제가 있어서 열심히 찾아보았다. 

https://crmrelease.tistory.com/117

-> 이 경우와 유사해보임. 

그냥 반복문을 사용하지 말고, .then() 을 여러개 써서 해두자. -> 방법은 나중에 찾는다. 

 

9. 

table 들과 credential을 관리하는 페이지

현재 RDBMS, AWS, EXCEL 로 나눠서 관리되고 있는 Data 들의 정보를 요약해서 보여주는 grid

그냥 찾아와서 front 에서 데이터 통일되도록 가공해서 보여주자

테이블 3개 목록 가져오기

 

10.

JS 에서 배열 합치기

https://hianna.tistory.com/397

concat() 을 활용해보려고 함 -> 원하는대로 동작함.

 

11. 

bootstrapVue 에서 popup 을 만들 때, <b-modal> 을 사용. 

전에 한번 했었는데 오늘은 잘 안되어서 다시 찾아보았다

https://bootstrap-vue.org/docs/components/modal

 

12. 

bootstrapVue <b-table> 을 cell editable 하게 만들 수 있는지

bootstrapVue b-table cell edit <- 이런 식으로 찾아봄 

sample) https://muhimasri.com/blogs/create-an-editable-dynamic-table-with-bootstrap-vue/

sample 에 대한 code) https://github.com/muhimasri/vue-editable-table-example/tree/main/src/components

 

bootstrapVue <b-table> 에 column 을 동적으로 추가하는 방법 

https://stackoverflow.com/questions/59760513/how-to-dynamically-add-a-column-to-bootstrap-vue-table

https://github.com/bootstrap-vue/bootstrap-vue/issues/4125

-> 찾아본 예시들에서 비슷한 방법을 보여주고 있다

v-slot 을 활용. 

 

13.

우선 jqxGrid 에서 SpreadSheet 를 만들어보자