그냥

https://infosec.exchange/

https://palant.info/

https://pfp.works/

https://github.com/palant

https://github.com/gohugoio/hugo

https://onethejay.tistory.com/58

https://beaniejoy.tistory.com/

# 참조

https://velog.io/@kcj_dev96/jsconfig.json

https://basemenks.tistory.com/266

# jsconfig.json 파일이 프로젝트 루트 디렉토리에 있음으로써

  해당 프로젝트가 js에 관련 있다는 것을 알 수 있다.

  또한 프로젝트에 포함할 파일, 제외할 파일, 컴파일 옵션도 설정할 수 있다.

# 위치

프로젝트 루트 경로에 위치

# exclude

프로젝트 내에서 제외할 파일 목록 지정

// ex
"exclude": [
  "node_modules",
  "**/node_modules/*"
]

# include

프로젝트 내에 포함할 파일 목록 지정

default : 모든 파일 포함

// ex
"include": [
  "src/**/*"
]

# compilerOptions

컴파일 옵션 설정

// ex
"compilerOptions": {
  "module": "commonJS",
  "target": "es6",
  "baseUrl": ".",
  "paths": {
    "@app/*": [
      "app/*"
    ]
  }
}

target : 사용할 javascript 문법 버전

  (es3, es5, es6, es2015, es2016, es2017, es2018, es2019, es2020, esnext)

module : module system 명시

  (amd, commonJS, es2015, es6, esnext, none, system, umd)

  주로 사용 되는 것 : es6 or commonJS, commonJS는 노드에서 사용될 때 지정됨

baseURL : 프로젝트 베이스 경로 지정 가능

  특정 경로 지정하여 편하게 상대경로 지정 가능

paths : baseURL 기준, 파일 불러올 때 기준점 설정 가능

  (paths 옵션 지정을 위해서는 baseURL 옵션 필수)

# 참조 : https://javascript.plainenglish.io/10-useful-javascript-coding-techniques-that-you-should-use-772b17c2d90b

# positive

// no
const TEST = 1
const isNotTest = (test) => { return test !== TEST }
if (!isNotTest(test)) { ... }

// YES
const TEST = 1
cconst isTest = (test) => { return test === TEST }
if (isTest(test)) { ... }

# define the number as a constant

// no
const getInfo = (age) => {
  return {
    name: 'test',
    isMiddleAge: age >= 35
  }
}

// YES
const MIDDLE_AGE = 35
const getInfo = (age) => {
  return {
    name: 'test',
    isMiddleAge: age >= MIDDLE_AGE
  }
}

# wrap multiple conditional judgments

// no
if (age >= 20 && follwers >= 100 && (origin === 'ko' || origin === 'korea')) { //... }

// YES
const checkCanApplyMPP = (options) => {
  const {age, follwers, origin} = opitons
  const canApplyMPP = age >= 20 && follwers >= 100 && ['ko', 'korea'].includes(origin)
  return canApplyMPP
}
if (chackCanApplyMPP({age: 20, follwers: 90, origin: 'korea'})) { //... }

// YES 2
const canApplyMPP = age >= 20 && follwers >= 100 & ['ko', 'korea'].includes(origin)
if (canApplyMPP) { //... }

# Reduce If...else noodle code

// no
const runTest = (result) => {
  if (result === 'a') {
    return 0
  } else if (result === 'b') {
    return 1
  } else if (result === 'c') {
    return 2
  }
}
console.log(runTest('a')) // 0

// YES
const runTest = (result) => {
  const codeMap = {
    'a': 0,
    'b': 1,
    'c': 2,
    // ...
  }
  return codeMap[result]
}
console.log(runTest('a')) // 0

# Use 'filter' and 'map' instead of 'for' loops

// DATA
const list = [
  {
    result: 'a',
    code: 0,
  },
  {
    result: 'b',
    code: 1,
  },
  {
    result: 'c',
    code: 2,
  },
  {
    result: 'd',
    code: 3,
  },
]

// no
const result = []
for (let i = 0; len = list.length; i < len; i++) {
  if (list[i].group === 1) {
    result.push(list[i].result)
  }
}

// YES
const result = list
  .filter((list) => list.group === 1)
  .map((list) => list.result)
console.log(result) // ['a', 'b', 'c']

# Swap two values using destructuring

// no
let test1 = 'a'
let test2 = 'b'
let temp = test1
test1 = test2
test2 = temp
console.log(test1, test2) // ba

// YES
let test1 = 'a'
let test2 = 'b'
;[test1, test2] = [test2, test1]
console.log(test1, test2) // ba

# Smarter Object.entries

// DATA
const testMap = {'a': 0, 'b': 1, 'c': 2, 'd': 3}
Object.prototype['e'] = 4

// no
for (const key in testMap) {
  console.log(key, testMap[key])
}

// YES
Object.entries(testMap).forEach(([key, value]) => {
  console.log(key, value)
})

# Easy way to flatten an array

// DATA
const result = [['a', ['b']], ['c', ['d', ['e']]]]

// 1
const flattenResult = (result) => {
  return result.reduce((res, result) => {
    return res.concat(Array.isArray(result) ? flattenResult(result) : result)
  }, [])
}
console.log(flattenResult(result))

// 2
result.flat(Infinity)

# Rounding Trick - usin '~~' operator

const map = [
  {
    result: 'a',
    code: 0
  },
  {
    result: 'b',
    code: 1
  },
  {
    result: 'c',
    code: 2
  },
]
const testResult = map.map((test) => {
  return {
    result: test.result,
    code: test.code
  }
})
console.log(testResult)

# Use reduce to calculate the sum

// DATA
const map = [
  {
    result: 'a',
    code: 0,
    error: 0,
  },
  {
    result: 'b',
    code: 1,
    error: 3,
  },
  {
    result: 'c',
    code: 2,
    error: 2,
  },
  {
    result: 'd',
    code: 3,
    error: 1,
  },
]

// no
let str = ''
map.forEach((map) => {
  str += map.code + '(' + map.error + ')'
})
console.log(str)

// YES
let str = map.reduce((res, map) => res += map.code + '(' + map.error + ')', '')
console.log(str)

# 다시 찾기 귀찮은 것들 그냥 마구 적어놓음

ESLint : linter, 오류 잡을 시 사용

Prettier : formmater, 스타일 교정 시 사용

사용처가 다르므로 차이점을 알고 사용해야 한다.

### ESLint

Airbnb

Naver

Google

standardJS

- package.json

name : 패키지명, npm으로 공유하려면 eslint-config-[이름] 으로 작성 필요

peerDependencies : ESLint, Plugins 버전

- index.js

필요에 따라 디렉토리별 나누어 관리

- Plugins

기본 제공 규칙 외 다양한 규칙들을 플러그인을 통해 사용 가능함

eslint-plugin-jsdoc : 소스코드 문서화 쉬워짐. JSDoc을 정적 분석하는 역할을 함

  플러그인의 규칙을 통해서 JSDoc을 항상 사용하도록 설정할 수 있음

  JSDoc 포맷, 스타일 검사 가능.

typescript-eslint : 타입스크립트에 대한 정적 분석을 지원함

  기존 TSLint가 있으나 모든 규칙을 제공하지는 않으니 주의 필요

eslint-plugin-markdown : 마크다운에 있는 코드 블록 대상으로 ESLint 사용 가능함

  ESLint의 custom processor를 이용해 다크다운의 코드블록에 대한 정적 분석 수행함

  스타일 가이드, 튜토리얼과 같이 코드가 많이 들어가는 문섬에 유용함

- rules

  직접 규칙 설정 가능, 기본 규칙과 옵션은 ESLint Rules에서 확인 가능

  규칙을 어겼을때 warning(종료코드 영향 없음)/error(종료코드 1) 발생 시킬 수 있음

### Prettier

quote 검색해서 원하는 부분에 auto/double 선택되어 있는 옵션들을 single로 변경

참고 : https://prettier.io/docs/en/configuration.html

### 공부하며 참조

https://tech.kakao.com/2019/12/05/make-better-use-of-eslint/

https://velog.io/@rlaclgns321/eslint-prettier-%EC%84%A4%EC%B9%98%EB%B0%A9%EB%B2%95

https://www.npmjs.com/package/eslint-config-airbnb-base

https://velog.io/@yrnana/prettier%EC%99%80-eslint%EB%A5%BC-%EA%B5%AC%EB%B6%84%ED%95%B4%EC%84%9C-%EC%82%AC%EC%9A%A9%ED%95%98%EC%9E%90

https://parkyounghwan.github.io/2019/06/29/javascript/style-guide/

* 하루가 더 길고 여유를 가질 수 있으면 좋겠다

* 일단 시간이 너무 없다 공부만 할 순 없는데..

URL : https://snippet-generator.app/

source(githib) : https://github.com/pawelgrzybek/snippet-generator

이런게 있는줄 몰랐네

# 참조 : https://fatfish.medium.com/5-javascript-utility-libraries-to-improve-your-efficiency-ae463d30eb7a

# Day.js
날짜, 시간 포맷 지정

console.log(dayjs().format('YYYY-MM-DD HH:mm:ss')) // 2023-01-04 13:45:30

만약 Moment.js 사용중이라면 이미 Day.js 속해있으므로 그냥 사용 가능하다
URL : https://day.js.org/

# qs.js
아니,,이건 좀 써봐야겠음 잘 모르겠다.
URL : https://github.com/ljharb/qs

# js-cookie.js
쿠키 읽고 쓰기
URL : https://github.com/js-cookie/js-cookie

Cookie.set('name', 'test1', { exoires: 10})
Cookie.get('name') // test1

# Lodash
필요성을,,아직 잘 모르겠다
URL : https://github.com/lodash/lodash

# Vconsole
텐센트 ?!
모바일(리얼 폰)에서 웹 디버깅에 도움이 되는..? 어..?
URL : https://github.com/Tencent/vConsole

[폰에서 데모 페이지 보고 첨부함]

매일경제 IT/과학 분야 보다가 기록

# 큐렉소 ?!

https://www.mk.co.kr/news/it/10590829

# 국민의 건강을 생각하고 금연을 응원한다면 담배 가격을 올리고 금연보조제/치료제 가격을 낮추고,

편의점이나 여러 곳에서 구매할 수 있도록 만들어라.

말만 금연 응원 한다고 하면서 사실 흡연자들이 내는 세금은 무시 못하지 않나?

금연 하고 채혈 검사로 검증되면 현금 준다고 해봐. 나도 금연한다.

https://www.mk.co.kr/news/it/10590818

# 그냥 KT랑 일해봐도 못믿을 곳이라는 것을 알 수 있다.

자기들 성과는 채우되 고객들은 중요하지 않고,

언론이나 계약직, 노조들은 그냥 시간 지나면 조용해지는 개돼지들이라고

손수 그렇게 생각하고 실천해주는 곳이다. 

https://www.mk.co.kr/news/it/10590810

# 코스맥스

https://www.mk.co.kr/news/business/10590784

# 포스트랩

https://www.mk.co.kr/news/it/10590731

# 오늘도 역시 적어두고 싶은 내용이나 링크만 간략하게 남김

## 기획뉴스 TOP1 : NoCode 리스트

노코드가 이렇게 인기라니?

편해서? 빨라서? 비용절감??

단기적인 효과일지 장기적으로도 이로울지 모르겠다.

연구가 되어서 충분히 효과가 있으니 이슈가 되고 사람들이 주목하는 거겠지??

- 스타트업 리스트

디자인, 개발, 금융, 런칭, 마케팅, 커뮤니케이션 등 필요한 툴들 있다.

https://startupstash.com/

- 프론트엔드 리스트

프론트엔드 개발자라면 필요한 CSS 프레임워크, 아이콘, 각종 유용한 크롬 익스텐션, HTML 치트키(?!)까지 한방에?!

https://devtooly.com/home

## 개발뉴스 TOP 3

- 1위 : 2022 대선 공약을 NFT로 박제

https://www.momentos.news/library

- 2위 : 2022년 개발자 연봉, 언어, 복지 순위 (?! 오)

https://spectrum.ieee.org/software-engineer-salary-2657117801

- 3위 : 2022 프론트엔드 개발자 로드맵

https://roadmap.sh/frontend

## AI가 PPT도 만들어줘??

https://www.chatbcg.com/

Subject : What is JAVA

Resulst : 흠...

# 끝

Nikto is an open source web server scanner that can be used to test the security of web servers by performing a comprehensive scan to identify potential vulnerabilities and misconfigurations. Here's how to use Nikto:

1. Download and install Nikto on your computer. You can download it from the following link: https://cirt.net/Nikto2
2. Open a terminal or command prompt and navigate to the directory where Nikto is installed.
3. Run the following command to scan a web server:

./nikto.pl -h <website>

Replace <website> with the URL of the web server you want to scan.

1. You can also specify additional options to customize the scan. For example, you can use the -port option to specify a specific port to scan, or the -output option to save the scan results to a file.
2. Once the scan is complete, Nikto will display a list of potential vulnerabilities and misconfigurations that it has identified.

It's important to note that Nikto is just one tool that can be used to test the security of a web server. It's a good idea to use a variety of tools and techniques to thoroughly test the security of your web servers.

After downloading Nikto2, windows detect this as Hack tool, soon.

? _ ?

# PPT 디자인 작업 때 사용할 저작권 없는 무료 이미지 사이트 모음

https://www.freepik.com/

https://pixabay.com/ko/

https://stocksnap.io/

https://unsplash.com/

https://pixels.com/

https://www.foodiesfeed.com/

# 사이트 참고한 블로그

https://lovoon.tistory.com/3

https://gomguard.tistory.com/179