[과제] 위 페이지에서 테이블의 데이터를 취득해서 바탕화면의 엑셀 파일에 저장한다. 테이블의 세 번째 행인 '공고명'부터 '입력일시'까지 취득하며 마지막 행에는 데이터를 취득한 시간을 추가한다.

1. NoSuchElementException

테이블을 개발자 도구로 검사하고 Xpath를 복사하고 검색하면 'NoSuchElementException' 에러가 발생한다. 이 문제는 HTML 문서가 여러 개의 frame으로 구성되어 있고 frame 마다 head와 body가 존재하기 때문에 발생한다. 내가 취득하려는 데이터가 있는 frame으로 이동하려면 다음과 같이 입력해야 한다.

// Switch to main frame
driver.SwitchTo().Frame("sub");
driver.SwitchTo().Frame("main");

2. table Xpath -> tr

그 다음 table의 Xpath를 복사하고, table의 element 중 tr 태그를 찾아 리스트에 저장한다.

// Find table element
var table = driver.FindElement(By.XPath("//*[@id=\"resultForm\"]/div[2]/table"));

// Find every table row
var rows = table.FindElements(By.TagName("tr"));

// Save table data in 'tableData'
List<List<string>> tableData = new List<List<string>>();

 // flag to check first row
bool isFirstRow = true; 

3. 데이터 취득(특정 인덱스부터, 내용 추가)

과제의 경우 공고명에서부터 입력일시까지의 데이터를 취득해야 했다. 이를 구현하기 위해 td 태그의 3번째 인덱스부터 cells.Count-2까지 리스트에 저장하도록 반복을 수행했다. 셀에 검색한 오늘의 날짜도 입력해야 해서 데이터를 취득한 현재 시간을 'yyyy.MM.dd HH:mm'의 골로 변환해서 행에 추가했다.

foreach (var row in rows)
{
    // Not to add current date and time in first row
    if (isFirstRow)
    {
        isFirstRow = false;
        continue; 
    }

    // Find every 'td' in every row
    var cells = row.FindElements(By.TagName("td"));
    List<string> rowData = new List<string>();

    // Use for loop start with 3rd index
    for (int i = 3; i < cells.Count-2; i++)
    {
        // Extract cell data
        rowData.Add(cells[i].Text);
    }

    // After extracting, add current date and time
    string currentDateTime = DateTime.Now.ToString("yyyy.MM.dd HH:mm");
    rowData.Add(currentDateTime);

    // If row data is not empty, then add to list 'tableData'
    if (rowData.Count > 0)
    {
        tableData.Add(rowData);
    }
}

4. 바탕화면의 엑셀 파일 경로 가져오기

바탕화면에 '장표.xlsx' 파일이 있다고 가정한다. 해당 파일의 경로를 가져와서 작업하기 위해 다음과 같이 작성한다. ExcelPackage를 사용할 때는 EPPlus 패키지가 필요하고 상업적, 비상업적으로 사용하겠다는 라이센스 설정이 필요하다. 필자는 비상업적으로 이용하기 때문에 이를 NonCommercial로 설정했다.

// License setting as NonCommercial
ExcelPackage.LicenseContext = LicenseContext.NonCommercial;

// Get folder path of desktop
string desktopPath = Environment.GetFolderPath(Environment.SpecialFolder.Desktop);

// Set file path
string filePath = Path.Combine(desktopPath, "장표.xlsx");

// Create ExcelPackage object
FileInfo fileInfo = new FileInfo(filePath);

5. 취득한 데이터를 엑셀 워크시트에 추가하기

가장 첫 번째 워크시트를 사용하고, 마지막 행을 찾아 한 줄을 더한 행에 데이터를 추가한다. table의 데이터를 저장한 'tableData' 리스트의 row를 반복문으로 추가한다. 전부 추가하고 나면 변동사항을 저장하고, 출력이 성공적으로 완수되었다는 콘솔 메세지를 출력한다.

 using (ExcelPackage package = new ExcelPackage(fileInfo))
{   
    // Use first worksheet
    ExcelWorksheet worksheet = package.Workbook.Worksheets[0]; 

    // Find last row to add extracted data
    int lastRow = worksheet.Dimension.End.Row + 1; 

    // Add data
    foreach (var row in tableData)
    {
        for (int i = 0; i < row.Count; i++)
        {
            worksheet.Cells[lastRow, i + 1].Value = row[i];
        }
    lastRow++;
    }
    // Save changes
    package.Save();
}
Console.WriteLine("Extracting is sucessfully worked!");

6. 실행결과

전 후

1. VS code 에서 C# 프로젝트 만들기

How to Program C# in Visual Studio Code [2023] 이 영상을 참고해서 C# 프로젝트를 생성했다. 방법은 다음과 같다.

1. Extension에서 C# Dev Kit 설치
2. VS code를 다시 시작하고 'C# 개발 키트 시작' 을 따라한다.
3. .NET SDK가 설치되었는지 확인한다. dotnet --version 커맨드로 설치 여부를 검사할 수 있다.
4. 작업할 폴더를 연다. '.csproj' 파일이 위치한 폴더이다. 없으면 검색창에서 새로 생성한다.
5. 검색창에 >.NET: New Project 로 새 프로젝트를 생성할 수 있다.
6. 새 프로젝트의 이름을 생성했다면 하위 파일 중 '.cs'가 포함된 파일에서 작업하면 된다.
7. 실행과 디버그 창에서 '모든 자동 디버그 구성 표시' -> '인터페이스 변경' 을 누르면 왼쪽 상단에 녹색 실행버튼이 생성되는데 이걸로 디버깅하면 된다.
8. 추가로 GitHub Copilot을 설치하면 코딩할 때 도움이 된다고 한다.

2. Selenium

[셀레니움/Selenium. C#] 웹 페이지의 텍스트 박스에 문자열 입력하기 (예제 포함) [셀레니움/Selenium, C#] 웹 페이지의 버튼 클릭하기 (예제 포함) [셀레니움/Selenium, C#] 테이블의 셀 데이터 취득하기 (예제 포함)

상단의 블로그 게시물을 참고해서 전체 프로세스를 이해했다. 코드 작성은 GPT4를 사용했다.

3. 검색 자동화

위 캡쳐본은 나라장터의 검색창의 일부를 캡쳐한 것이다.

과제는 다음과 같다.

1. 공고명에 'RPA'를 입력한다.
2. 공고/개찰일에 각각 오늘날짜로부터 5일전 날짜/오늘날짜를 입력한다.
3. 검색버튼을 클릭한다.

이 세 가지 단계를 자동화해야 했다. **

1. 공고명에 'RPA'를 입력한다.* 텍스트 박스를 개발자 도구로 검사한다. 공고명 검색창의 Xpath는 //[@id="bidNm"] 이다. 이제 이 태그를 찾아 검색어를 key로 보내주면 된다.

아래 코드는 다음과 같이 동작한다.

1-1. 원하는 URL로 이동한다. 1-2. 페이지가 정상적으로 로딩될 때까지 기다린다. 1-3. id 태그가 bidNm인 element를 찾아서 "RPA"를 key로 전송한다.

// Navigate to the website
driver.Navigate().GoToUrl("https://www.g2b.go.kr/index.jsp");

// Wait for the page to load completely
WebDriverWait wait = new WebDriverWait(driver, TimeSpan.FromSeconds(10));

// Find the search input by its ID and enter a search term
var searchInput = driver.FindElement(By.Id("bidNm"));
searchInput.SendKeys("RPA");

2. 공고/개찰일에 각각 오늘날짜로부터 5일전 날짜/오늘날짜를 입력한다. 다음으로 조회하려는 기간을 'yyyy/MM/dd'의 형태로 입력해야 했다. 이를 위해 오늘 날짜를 계산하고 4를 빼서 조회기간을 설정했다. 그 후 날짜 입력 창의 id에 조회기간을 key로 전송한다.

아래 코드는 다음과 같이 동작한다.

2-1. 오늘 날짜와 5일 전 날짜를 계산한다. 2-2. 데이터를 yyyy/MM/dd 형태로 format한다. 2-3. id 태그가 fromBidDt와 toBidDt인 element를 찾아 format 한 데이터를 입력한다. 검색창이 채워져 있을 수도 있으니 Clear()로 지워준다.

// Calculate the today dates
DateTime today = DateTime.Today;
DateTime fiveDaysAgo = today.AddDays(-4);

// Format the dates as YYYY/MM/DD
string todayFormatted = today.ToString("yyyy/MM/dd", CultureInfo.InvariantCulture);
string fiveDaysAgoFormatted = fiveDaysAgo.ToString("yyyy/MM/dd", CultureInfo.InvariantCulture);

// Find the start date input by its ID and enter the calculated date
var fromDateInput = driver.FindElement(By.Id("fromBidDt"));
fromDateInput.Clear(); // Clears any pre-filled values in the input field
fromDateInput.SendKeys(fiveDaysAgoFormatted);

// Find the end date input by its ID and enter today's date
var toDateInput = driver.FindElement(By.Id("toBidDt"));
toDateInput.Clear(); // Clears any pre-filled values in the input field
toDateInput.SendKeys(todayFormatted);

3. 검색버튼을 클릭한다. 검색 버튼의 Xpath를 복사해서 Click()한다.

// After entering the dates, click the search button 
var searchButton = driver.FindElement(By.XPath("//*[@id=\"searchForm\"]/div/fieldset[1]/ul/li[4]/dl/dd[3]/a/strong"));
searchButton.Click();

위 단계를 거치면 검색 자동화 완성이다. 코드를 실행하면 자동으로 테이블이 위치한 페이지로 이동한다. 다음 게시글에서 테이블의 셀 데이터를 취득하는 방법을 알아보자.

• 양동이가 놓일 수 있는 위치를 미리 0 으로 만든다.
• 양동이 위치를 하나씩 방문해, 해당 양동이부터 -K, +K 까지 범위에 얼음이 있는 양동이가 존재한다면, 양동이에 얼음을 합산한다.
• 최대 얼음이 존재하는 양동이의 인덱스 위치를 반환한다.

N, K = map(int, input().split())

xg = {}
for _ in range(N):
    g, x = map(int, input().split())
    xg[x] = g
xg1 = dict(sorted(xg.items()))

mx = max(xg1)
mn = min(xg1)

length = mx - mn + 1
bag = [0 for _ in range(length)]

for i in range(mn, mx + 1):
    for j in range(i - K, i + K + 1):
        if j in xg1:
            bag[i - mn] += xg1[j]

print(bag.index(max(bag)) + 1)

결과

• 시간초과
• 비효율적인 탐색, 불필요한 반복

투포인터 알고리즘 or 슬라이딩 윈도우 기법

• 각 구간의 합을 한 번만 계산한다. 구간이 이동할 때마다 더하거나 빼는 방식으로 빠르게 구간 합을 업데이트할 수 있다.

참고한 솔루션

구간합 = 슬라이딩 윈도우

• 윈도우의 사이즈를 2*K + 1로 설정한다.
• 윈도우를 한 칸씩 옮겨가면서 마지막 값은 추가하고, 첫 번째 값은 빼주는 식으로 윈도우 값을 업데이트한다.

  # 슬라이딩 윈도우
  N, K = map(int, input().split())
  ice = [0] * 10000001
  

for _ in range(N): g, x = map(int, input().split()) ice[x] = g

초기 윈도우

window = sum(ice[:2*K+1]) max_sum = window

for i in range(1, 10000001 - 2K): window = window - ice[i - 1] + ice[i + 2K] max_sum = max(window, max_sum)

print(max_sum)

```

투포인터 익숙해지기.

겹치는 선분의 길이

def solution(line):
    answer = 0
    count = [0 for _ in range(200)]
    for l in line:
        for i in range(l[0], l[1]):
            count[i + 100] += 1

    answer += count.count(2)
    answer += count.count(3)
    return answer

첫 번째 솔루션

• 선분의 길이 제한이 -100 이상, 100 이하인 정보를 사용한다.
• 각 점의 위치마다 선분이 지나가면 점에 +1 을 추가한다. 모든 선분을 지난 후 해당 점이 포함된 선분의 개수가 2개 혹은 3개인 경우에만 정답으로 세서 겹치는 선분의 총 길이를 계산한다.

def solution(line):
    sets = [set(range(min(l), max(l))) for l in line]
        return len(sets[0] & sets[1] | sets[0] & sets[2] | sets[1] & sets[2])

두 번째 솔루션

• set()으로 최소, 최소 길이를 받아주고 두 번 겹치는 선분은 and 연산으로 결합한다. 이러면 겹치는 선분의 범위만 구할 수 있다.
• 겹치는 선분의 최종 합을 구하려면 겹치는 선분끼리는 or 연산으로 결합해야 한다. 이때 set를 사용하기 때문에 범위가 중복되지 않는다.

후기

• level 0 치고는 아이디어 떠올리기가 어려웠던 문제라고 생각한다. 겹치는 선분의 길이의 합은 겹치는 점의 총 갯수를 세서 구할 수 있다. set을 사용하는 방법은 떠올리기 쉽지 않을 것 같다.

난이도: Level 0

def solution(num, total):
    '''
    num개의 수의 합이 total과 같은지를 확인하는 문제
    start, start+1, start+2, ... start+num-1
    = num*start + num*(num-1)//2

    start를 어떻게 결정할 것인가?
    num이 홀수인 경우
        total // num = 가운데 수
        start = total // num - num // 2
    num이 짝수인 경우
        total // num = 가운데 바로 옆수
        start = total // num - num // 2 + 1
    '''

    answer = []
    start = 0

    # num이 홀수
    if num%2:
        start = total // num - num // 2
    # num이 짝수
    else:
        start = total // num - num // 2 + 1

    for i in range(start, start + num):
        answer.append(i)
    return answer

백준: 1 (4375번)

난이도: 실버3

'''
각 자리가 모두 1로 구성된 n의 배수의 자리수를 출력하는 문제

n의 배수를 구해서 1로 구성됐는지 확인한다 X
1의 배수를 만들어서 n의 배수인지 확인한다 o
'''
import sys

while 1:
    try:
        n = int(sys.stdin.readline())
    except:
        break

    # i는 자리수
    i = 1
    check_num = 1

    while 1:
        if check_num % n == 0:
            print(i)
            break
        check_num = 10*check_num + 1
        i += 1

저주의 숫자 3 프로그래머스 LEVEL 0 조건: 3의 배수와 숫자 3을 사용하지 않는다.

풀이: n만큼 for문을 돌면서 3을 포함하거나 3의 배수인 경우에는 + 1 한다. 증가한 숫자가 저주의 숫자인 경우도 검사하기 위해 while 문을 사용

def solution(n):
    i = 0
    for _ in range(n):
        i += 1
        while i % 3 == 0 or '3' in str(i):
            i += 1
    return i

10844: 쉬운 계단 수

아이디어

• 점화식, 2차원 DP 테이블

• DP 테이블: dp[자리수][해당 자리에서 가장 뒤에 오는 숫자] = 경우의 수

• 점화식의 세분화

  • 가장 뒤에 오는 숫자 = 0)

    • 0 앞에 올 수 있는 건 1 하나 뿐이다.

      dp[자릿수][0] = 1

  • 가장 뒤에 오는 숫자 = 1~8)

    • dp[자리수][가장 뒤에 오는 숫자] = dp[자리수-1][가장 뒤에 오는 숫자-1] + dp[자리수-1][가장 뒤에 오는 숫자+1]

  • 가장 뒤에 오는 숫자 = 9)

    • dp[자리수][9] = 1
    • 9 앞에 올 수 있는 건 8 하나 뿐이다.

# 1일 1백준
import sys
n = int(sys.stdin.readline())

# dp 테이블 초기화
dp = [[0]*10 for _ in range(n+1)]

# 1의 자릿수의 경우 초기화
for i in range(1, 10):
    dp[1][i] = 1

for i in range(2, n+1):
    for j in range(10):
        if j == 0:
            dp[i][j] = dp[i-1][1]
        elif 1 <= j <= 8:
            dp[i][j] = dp[i-1][j-1] + dp[i-1][j+1]
        else:
            dp[i][j] = dp[i-1][8]
print(sum(dp[n]) % 10**9)

240204 - 240205 자바스크립트 기초 강좌 : 100분 완성 강의를 수강하고 공부한 내용을 정리한 것입니다.

240204

출력 함수

• alert(): 브라우저 경고창 출력하기
• console.log(): 콘솔창에 출력하기

변수의 자료형

• let, const
• 차이점: let은 변수에 다른 값을 재할당할 수 있지만, const는 상수로 한 번만 선언이 가능하며 값을 바꿀 수도 없다.

변수의 약속

• 1. 변수는 문자와 숫자, $만 사용한다.
• 2. 첫 글자는 숫자가 될 수 없다.
• 3. 예약어는 사용할 수 없다.
• 4. 가급적 상수는 대문자로 작성한다.
• 5. 변수명은 읽기 쉽고 이해하기 쉽게 선언한다.

자료형

• \뒤에 선언하면 특수문자로 인식한다.
• ₩벡틱은 문자를 변수로 표현해줄 때 효과적이다.
  • ${변수명}
• 숫자형은 사칙연산이 가능하다.
• NaN = Not A Number
• boolean = true, false
• null = 값이 존재하지 않는다 / undefined = 값이 정의되지 않았다.
• typeof 연산자는 변수의 자료형을 출력한다.
• 숫자형을 문자형과 더할 수 있다. 다만 이 경우, 숫자형이 문자형으로 변환됨에 주의하자.

객체형

• null ≠ 객체

주석

• //

대화상자

• alert, prompt, confirm
• alert() = 일방적인 알림 용도
• prompt() = 사용자에게 메세지를 보여주고, 어떤 값을 입력받을 때 사용한다.
  • 취소를 입력하면 null이 입력된다.
  • 인수 = 함수의 입력에 들어가는 값
  • 두 개 이상의 인수가 들어가면 마지막 인수가 디폴트 인수가 된다. 안내 사항을 전달할 때 좋다.
  • prompt()로 입력받은 값은 문자형으로 입력된다.
• confirm() = 사용자로부터 확인 받을 때 사용한다.
  • alert()와 다른 점은 취소버튼이 추가되어 있음.

대화상자 예시코드

const name = prompt("메세지");
alert("안녕하세요" + name + "님.");
alert(`안녕하세요 ${name}님.`);

기본 알림창의 단점

• 스크립트가 일시정지된다.
• 스타일링이 불가능하다. 디자이너가 싫어한다.

자료형 변환

• String() = 문자형으로 변환
• Nubmer() = 숫자형으로 변환
  • true 와 false는 Number()로 형변환하면 1과 0이 나온다.
• 사칙연산에는 자동형변환이 적용된다. 원인을 찾기 힘드니까 의도를 가지고 명시적 형변환을 해주는 것이 좋다.

암기: 자료형 주의사항

Number(null) // 0
Number(undefined) // NaN

Number(0) // false
Number('0') // true
Number('') // false
Number(' ') // true

연산자

• 증감연산자
  • 앞에 붙이면 증가한 값을 반영, 뒤에 붙이면 값을 반영한 후 증가. C랑 똑같다.
• === : 일치연산자, 자료형까지 검사한다. 동등연산자보다 일치연산자로 검사하는게 좋다.

조건문

if(조건문의 내용){
    조건을 만족하면 수행하는 부분
}

논리연산자

• || : OR, 첫 번째 true를 발견하는 즉시, 평가를 멈춘다.
• && : AND, 첫 번째 false를 발견하는 즉시, 평가를 멈춘다.
• ! : NOT
• 어떤 평가로 순서를 배치하는지도 중요하다. 성능 최적화를 위함.

반복문

// for
for(let i;i < 10;i++){
    // 반복할 코드
}

// while
let i = 0;
while(i<10){
    // code
    i++;
}

// do while
let i = 0;
do{
// code
    i++;
} while(i<10)

반복문 탈출 - break, continue

• break = 멈추고 반복문 탈출
• continue = 멈추고 다음 반복문

개발자는 항상 좀 더 쉽게 일하고, 코드를 줄이기 위해 노력해야 한다. 그래야 성능도 좋아진다.

Switch 문

• if else 를 알고 있으면 몰라도 된다.
• case가 많을 때 사용하기 유용하다는 것만 알면된다.

switch(평가){
    case A:
    // A일 때 코드
    case B:
    // B일 때 코드
    default:
    // code
}

• switch는 case 이후 모든 문장을 출력한다. 각 case마다 break를 걸어주자.
• case에 없는 입력값이 주어지면 제대로 동작한 건지, 오류가 난건지 사용자 입장에서 모르기 때문에 default를 사용한다.

함수(function)

• 자주 사용하거나 여러 곳에서 사용하는 코드라면 하나로 만든 다음 재사용한다. 중복되는 코드도 줄어들고 재사용성도 좋아진다.
• 브라우저 내장함수: console, alert, confirm

// 함수 선언 예시
function sayHello(name){
    console.log(`Hello, ${name}`);
}

• 매개변수가 여러개라면 쉼표로 구분할 수 있다.
• let으로 선언한 변수는 다시 let으로 선언할 수 없다.

240205

• 전역변수와 지역변수는 서로 간섭을 받지 않는다.
• 함수 선언시 매개변수의 디폴트 값을 선언해줄 수 있다.

  // default value
  

function sayHello(name = 'friend'){ let msg = Hello, ${name} console.log(msg) }

sayHello() // result = friend sayHello('Jane') // result = Jane

```jsx
// return으로 값 반환
function add(num1, num2){
    return num1 + num2;
}

const result = add(2,3);
console.log(result);
// 5

• return 문이 쓰이거나 return만 단독으로 쓰이면, undefined를 반환한다.
• return 만 선언해서 함수를 종료하는 목적으로도 사용한다.
• 읽기 쉽고 어떤 동작인지 알 수 있게 네이밍한다.

함수 선언문 vs 함수 표현식

• 순차적으로 코드를 읽으면서 즉시 결과를 반환하는 언어를 인터프리터 언어라고 한다.
• 함수를 함수 선언문으로 작성하면 어느 위치에서든 함수를 선언하고 사용할 수 있다.
• 자바스크립트 내부 알고리즘은 실행 전 초기화 단계에서 코드의 모든 함수 선언문을 찾아서 생성해둔다. 함수의 사용 가능 범위는 코드보다 높아진다. 이를 Hoisting이라고 한다.
• 함수 표현식은 코드에 도달했을 때 함수가 생성된다. 함수 표현식으로 함수를 작성할 경우, 함수 표현식 이후에만 해당 함수를 사용할 수 있다.
• 함수 선언문이 함수 표현식보다 더 자유롭다.

화살표 함수(arrow function)

• 한 줄씩 존재하는 건 대부분 생략 가능하다.
• return 문 하나만 작성되는 경우, 소괄호로 나타낼 수 있다.

// 화살표 함수 변환 전
const sayHello = function(name) {
}
// 화살표 함수 변환 후
const sayHello = (name) => {
}

// 전
const add = function(num1, num2) {
    const result = num1 + num2;
    return result;
}

// 후
const add = (num1, num2) => num1 + num2; 

• 화살표 함수는 ES6 이후 활발하게 사용되고 있기 때문에 필수로 알고 있어야 한다.

객체(object)

• 객체는 key와 value인 property로 구분된다. 파이썬의 dictionary와 비슷하다.
• 각 property는 쉼표로 구분한다. 마지막 쉼표는 없어도 무방하지만 있는게 수정이 용이하다.
• 접근, 추가, 삭제

  // Object
  const superman = {
    name:'clark';
    age;33,
  }
  

// 접근 superman.name // 'clark' superman['age'] // 33

// 추가 superman.gender = 'male'; superman['haircolor'] = 'black';

// 삭제 delete superman.haircolor;

- in 연산자를 사용하면 객체에 특정 property가 존재하는지 검사할 수 있다.
- for(let key in object) {} 로 선언한다.

```jsx
// for in 문 예제
const Mike = {
    name: 'Mike',
    age: 33,
}

for(x in Mike){
    console.log(x); // 'name', 'age'
    console.log(Mike[x]); // 'Mike', 33
}

객체 method / this

• 객체 property로 할당된 함수를 method라고 부른다. (C)

• fly: function() {} 를 fly() {} 처럼 단축 구문으로도 작성할 수 있다.

• 객체와 method의 관계 (this)

• 내 자신의 property를 method에 넣고 싶다면 this를 사용한다.

    // 객체 지향 프로그래밍
    sayHello: function() {
        console.log('Hello, I'm ${this.name}');
    }
  
    let boy = {
        name: 'Mike',
        sayHello(),
    }
  
    let girl = {
        name: 'Jane',
        sayHello(),
    }

  • this는 런타임에 결정된다.
  • 주의: 화살표 함수는 this를 가지지 않는다.
  • 화살표 함수 내부에서 this를 사용하면, 그 this는 외부에서 값을 가져온다. (전역객체를 가리킨다.)
  • this가 가장 어렵다.
  • 메소드에서는 this를 활용하는데 가장 좋다.
  • 메소드는 화살표 함수로 작성하는 것을 지양한다.

Array

선언

• let 배열명 = [요소1, 요소2, … 요소n개];

접근

• 배열명.[index값]

수정

• 배열명.[index값] = ‘수정값’;

특징

• 숫자, 문자, 함수, 객체 포함 가능

길이

• 배열명.length;

뒤에 추가

• 배열명.push(추가요소);

뒤에 제거

• 배열명.pop();

앞에 추가

• 배열명.unshift(추가요소);

앞에 제거

• 배열명.shift();

추가(push, unshift)의 경우 여러 개를 추가할 수도 있다.

반복문 for

• for(let index=0;index<days.length;index++){

    console.log(days[index])

  }

for of: for문 보다 간단하지만 인덱스를 얻지 못한다는 단점이 있다.

정리

강의로 학습한 내용은 다음과 같다.

• 변수, 자료형 이해
• console로 출력 확인
• alert, prompt, confirm
• 연산자, 조건문, 반복문, 함수와 객체, 배열에 대해 간단하게 학습함.

[다항식 더하기]

• ‘+’로 구분하여 리스트에 담기 = .split(’+’)
• 가장 마지막 원소가 ‘x’인 경우 x의 계수값에, 아닌 경우 상수값에 더해준다.
• 계수의 합이 0인 경우, 상수만을 출력한다.
• 계수의 합이 1인 경우, 1x 대신 x를 출력한다.
• 원소가 숫자인지 검사하고 싶다 = .isdigit()
• 원소가 문자인지 검사하고 싶다 = .isalpha()
• level 0 치고는 까다로웠던 문제

백준

[수리공 항승]

아이디어는 테이프를 이어붙인 범위 내에 구멍이 존재하는지 여부를 검사하는 것.

필요한 테이프의 길이의 총합을 구해서 필요한 테이프의 개수를 구한다 X

테이프가 필요할 때마다 개수를 한 개씩 추가한다.

필요할 때를 어떻게 아느냐? 시작지점부터 테이프 길이를 붙인다. 테이프 길이 안에 포함되면 기존의 테이프로 막을 수 있다.구멍이 1,2 테이프 길이가 2라면range(1, 3)까지는 기존 테이프로 막을 수 있음.하지만 3부터는 불가능하기 때문에 다음 구멍이 3을 넘어가면 그 값부터 다시 출발하도록 한다.

# 1일 1백준
N, L = map(int, input().split())
hole = sorted(list(map(int, input().split())))

start = hole[0]
count = 1

for h in hole[1:]:
    if h in range(start, start + L):
        continue
    else:
        start = h
        count += 1
print(count)

• 의외로 간단했던 문제, 아이디어 접근을 잘못했다.

문제 - 특이한 정렬

• 정렬에 우선순위 부여하기
• sorted(array, key=lambda x:[조건1, 조건2 …])
• sorted는 기존 배열에 영향을 주지 않는다.

백준

문제 - 세 개의 소수 문제

만약 어떤 숫자가 소수인지 알고 싶다면 제곱수를 사용한다.

• 2부터 루트 n까지의 수 중에서 n이 나누어 떨어진다면, n은 소수가 아니다.
• O(루트 n)

만약 어떤 숫자 이하의 모든 소수를 알고싶다면 에라토스테네스의 체를 사용한다.

• 2부터 루트 n + 1 까지 탐색하며, 자기 자신을 제외한 배수를 모두 제거한다.
• 이후 지워지지 않은 수들이 n 이하의 소수이다.
• O(NlogN)

• ‘5보다 큰 홀수’ 로 풀이 시도했으나 아이디어가 틀림.
• ‘3개 소수의 합’ 으로 나타내야 하며 이는 삼중 반복문으로 구현한다.
• 세 가지 원소를 오름차순으로 정렬하려면 key = lambda x: (x[0], x[1], x[2]) 를 사용한다.
• 리스트에 *를 사용하면 원소들을 unpacking 할 수 있다.

(배포) Django + React + Gunicorn + Nginx + EC2 배포하기 AWS EC2 인스턴스 생성 [AWS] 📚 아마존 가입 절차 / 보안 설정 (MFA & IAM) 정리 [AWS] Identity Center를 활용한 관리자 IAM 사용자 생성 (관리자 IAM 사용자를 사용하는 이유)

[+공부 필요] AWS 간단히 이해하기 - S3와 EC2 인프라 기술, 기계학 개념 이해하기

배포) Django + React 배포하기

캡스톤 디자인의 Django로 백엔드를, React로 프론트를 구성하여 웹을 만든 후, 배포를 진행한다.

1. 리액트 앱 빌드 -> Django에 넣기

리액트 프로젝트 npm run build 로 빌드 폴더를 생성한다. 그 후 장고 프로젝트 디렉토리 안에 client 폴더를 만들어 build 폴더 안에 있는 파일들을 모두 넣어준다.

2. build로 만들어진 index.html 파일을 들어가면 파일 경로를 지정해놓은 부분이 있을텐데 모두 앞에 .을 붙여주도록 한다. 이걸 안하면 파일 경로를 참조하지 못한다.

ex) /static/... -> ./static/...

3. template, static 경로 설정, debug = False

setting.py 에 들어가 template, static 경로를 설정해준다.

// template 경로 설정
TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': ['client'],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

static 경로 설정
STATIC_URL = '/static/'
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
ROOT_DIR = os.path.dirname(BASE_DIR)

STATICFILES_DIRS = [
        # 실제 static 파일은 모두 client 측에서 소유
        os.path.join(ROOT_DIR, 'client/static')
    ]

4. AWS EC2 인스턴스 생성

AWS EC2는 아마존 웹 서비스에서 제공하는 서비스로 크기 조정이 가능한 컴퓨팅 파워를 제공하는 웹 서비스이며, 몇 가지 주요 특징은 다음과 같다.

• 원하는 만큼의 가상 서버를 구축하고 보안 및 네트워크 구성과 스토리지 관리가 가능
• 클라우드 컴퓨팅 : 사용한 만큼만 돈을 지불한다.

클라우드 컴퓨팅이란?

데이터 저장과 컴퓨팅 파워를 개인의 컴퓨터에 의존하는 대신, 원격 서버와 데이터 센터의 자원을 사용하여 데이터를 처리하고 저장하는 방식을 말한다. 사용자가 필요에 따라 자원을 증가시키거나 감소시킬 수 있어 변동하는 작업에 유연한 대처가 가능하다. 또한 사용하는 만큼 비용을 지불하기 때문에 기업이나 개인이 비싼 하드웨어를 구매하고 유지할 필요가 없다. 인터넷이 연결 가능한 곳이라면 어디에서든 연결할 수 있다는 장점이 있고, 서비스 제공업체에서 서버를 유지 관리하므로, 소프트웨어와 보안 업데이트가 자동으로 이루어진다.

• AMI, EBS, EIP의 특징이 있다. (생략)

AWS - Amazon Web Services

• "Amazon Web Services(AWS)는 전 세계적으로 분포한 데이터 센터에서 200개가 넘는 완벽한 기능의 서비스를 제공하는, 세계적으로 가장 포괄적이며, 널리 채택되고 있는 클라우드입니다."
• AWS란 아마존에서 제공하는 클라우드 서비스이다.
• 아마존의 모든 서비스는 API 중심으로 설계되어 있어 모든 기능이 API로 제어가 가능하다.
• AWS는 10년 연속 매직 쿼드런트 클라우드 인프라 및 서비스 부문의 리더로 선정되었고, 전세계적으로 가장 큰 오픈소스 생태계를 가지고 있어 많은 오픈소스 프로젝트를 참고하거나 사용할 수 있다는 장점이 있다.
• 다양한 기능, 비용 절감, 빠른 일 처리, 보안까지 확실한 장점을 가진다.

API - Application Programming Interface

• 응용 프로그램에서 사용할 수 있도록, 운영체제나 프로그래밍 언어가 제공하는 기능ㅇ르 제어할 수 있게 만든 인터페이스이다.

AWS EC2 - Amazon Web Services Elastic Compute Cloud

• AWS 에서 제공하는 서비스 중 하나로, 사용자가 자신의 컴퓨터 앱을 실행할 가상 컴퓨터를 대여할 수 있도록 해준다. 쉽게 말해 "아마존에서 클라우스를 통해 빌려주는 가상 컴퓨터 서비스"이다.

EC2 인스턴스 생성하기

EC2 서비스에서 생성한 가상 서버를 인스턴스라고 한다.

AWS 회원가입

루트 사용자

• 개인 서버 오픈 -> AWS 회원가입이나 로그인 수행
• 루트 사용자 계정은 모든 권한을 갖는 SSO(Single Sign In) ID로 시작하게 된다. 이 말은 우리가 AWS의 모든 자원과 리소스를 이용할 수 있다는 이야기가 되며, 그 말은 모든 자원을 구매할 수 있다는 소리이다.
• 만약 악의적인 사용자의 공격으로 루트 사용자 계정이 탈취된다면, 악의적인 공격자는 돈을 벌기 위해 AWS의 아주 비싼 컴퓨터를 구매해서 엄청난 비트코인 채굴기를 설치해 채굴을 돌릴 것이다. 그럼 우리의 계정이 곧 비트코인 채굴용 컴퓨팅 서비스 용도로 사용되고, 천문학적인 금액의 피해가 발생할 수 있다. AWS는 공식적으로 루트 사용자 계정을 사용하지 않는 것을 추천한다.

IAM 사용자

AWS IAM - Amazon Web Service Identity and Access Management

• AWS 리소스에 대한 엑세스를 안전하게 제어할 수 있는 웹 서비스이다.
• IAM을 사용하면 각각의 행동에 따른 사용자들을 나눠 하나의 인스턴스를 이용할 수 있게 된다.

AWS 계정의 공유 엑세스

• IAM 증명서를 사용하면, 루트 계정을 몰라도 서로 공유하는 인스턴스에 접근할 수 있다.

• 다음과 같이 접근 권한을 다르게 나누어 줄 수도 있다.

Root 계정 보안 강화하기

처음 aws 계정을 생성하면 루트 계정으로 생성된다. 루트 계정은 모든 서비스와 빌링 관련 업무가 가능한 계정이기 때문에 가장 중요하게 관리해야 한다. 내 aws 계정이 비트코인 채굴 계정이 되어 3억원을 태우는 경험은 하고 싶지 않다.

보안 챌린지 설정

내 계정 - 보안 챌린지 질문 흔한 2단계 보안설정과 같다.

MFA 설정하기

Multi-Factor Authentication, 초단위 또는 분단위로 바뀌는 숫자

1. 검색창에 "IAM" 검색하기
2. "MFA 추가" 버튼 클릭
3. MFA 디바이스 선택 -> 모바일, 컴퓨터 선택
4. 구글 OTP 설치 -> QR 코드 띄워서 인식
5. 이제 로그인할 때 기본 ID, PW 와 OTP를 통해 로그인한다.

IAM 서브계정 사용자 추가하기

1. 루트계정 - 사용자 클릭
2. 사용자 - 사용자 추가 클릭
3. 그외 나머지 방법은 해당 링크 참고 https://growth-coder.tistory.com/115

계정생성 끝. 추가 연동은 다음 글에 작성.

OpenGL setup:GLFW and GLAD in Visual Studio Code on macOS

Video Link

1. glfw install and folder setting

1. homebrew 설치

   brew install glfw

2. 모든 파일과 라이브러리를 관리할 폴더 생성

• youtube 폴더 생성 (이름 달라도 됨)
• 하위 폴더 dependencies 생성
• 하위 폴더 include, library 생성

3. 터미널로 돌아와서 glfw 경로 복사

• Finder 열고 cmd+t로 새 파인더 탭 열기
• "폴더로 이동" 의 폴더 경로에 glfw 설치 경로 넣기
• glfw 폴더만 복사해서 include 폴더 안에 붙혀넣기

4. lib 폴더 돌아가서 libglfw.3.3.dylib 만 복사

• library 폴더에 붙혀넣기

2. vscode 기본 세팅

1. vscode에서 youtube 폴더 열기
2. main.cpp 파일 만들기
3. 
4. 컴파일러 선택

영상따라 선택함

5. tasks.json 코드에 "args"에 코드 추가

   "-std=c++17" # c++ version
   "-Wall" # ignore warnings
   "-I${workspaceFolder}/dependencies/include" # specify path to our include files with -I
   "-L${workspaceFolder}/dependencies/library" # specify the path to our library so with -L flag add path to our library
   "${workspaceFolder}/*.cpp" # execute all the cpp files so write *.cpp
   "${workspaceFolder}/dependencies/library/libglfw.3.3.dylib"
   "${workspaceFolder}/app"
   # famework 추가
   "-framework"
   "OpenGL"
   "-framework"
   "CoCoa"
   "-framework"
   "IOKit"
   "-framework"
   "CoreVideo"
   "-framework"
   "CoreFoundation"
   # disable the warning about warning no the deprecated 
   "-Wno-deprecated"
   

``` 이제 {workspaceFolder}가 우리의 프로젝트 폴더를 의미한다. 이거 다하고 main.cpp에서 command + shift + B로 빌드 ./app 누르면 실행 가능하다.

3. GLAD 설치

GLAD는 필요한 함수의 위치를 검색하고 이를 함수 포인터에 저장하는 데 도움이 됩니다.

OpenGL은 단순히 명세서일 뿐이고, 실제 함수의 구현은 driver manufacturer에 의해 제공된다.

1. 구글 GLAD 입력
2. gl 3.3 버전 - profile은 core로 선택
3. generate GLAD and download zip files

다운로드가 완료되면 glad - include 폴더 안의 두 파일(glad, KHR)을 복사한다.

복사 완료

4. glad 폴더 - src - glad.c 복사 - youtube 폴더(main directory)에 붙여넣기
5. vscode 설정 변경 "${workspaceFolder}/glad.c" 추가

다시 cmd+shift+b로 빌드 ./app으로 실행

예제코드가 잘 수행된다.

그러던 중 리액트 + AI로 웹사이트 딸깍하는 방법 있지 않을까를 고민하다가 재밌어보이는 걸 발견했다.

builder.io 오호라.. 리액트와 챗지피티를 결합해 프롬프트만 입력하면 웹사이트를 만들어주는 사이트가 있는 것 같아서 한 번 이용해보기로 했다.

회원가입을 하고 나서 보인 페이지 피그마를 code로 바꿀 수도 있고 적은 코드로도 랜딩 페이지를 만들 수 있다고 한다. 오호라.. 날먹 가능한 것인가?

프롬프트로 입력해서 완성한 코드는 리액트에서도 잘 돌아간다고 적혀있다.

우선 하라는대로 따라가보았다. 사용하는 프레임워크 (NextJS +@)의 터미널에 다음 명령어를 입력한다.

npm install @builder.io/react

하다가 든 생각은 builder.io는 피그마의 플러그인이라는 점. 그렇다면 피그마에서 Ai로 만들기도 충분히 가능하지 않을까 하는 생각이 들었다.

헷갈렸던 점 builder.io를 이용한다 vs figma에서 수행한다. 피그마에서 UI를 작업해도 리액트 문법으로 바꿔줄 수 있다. 아 그니까 builder.io도 어쨌든 피그마를 쓰는건데 AI 플러그인은 여러가지가 있는거고 그중에서 웹 사이트 프롬프트로 만들어주는게 builder.io라는 소리구나

찾아보니 피그마를 리액트로 만들어주는 사이트도 있었다. 그러면 AI로 피그마 스타일의 웹사이트만 만들면 리액트로도 얼마든지 바꿔줄 수 있다는 소리.

AI가 만들어주는 웹사이트 위 영상이 꽤나 흥미로웠다. 웹사이트의 와이어 프레임을 뚝딱 만들어주는데 신기한 건 바로 피그마로 내보낼 수 있다는 점.

처음 회원가입을 하고 build website로 넘어오면 보이는 페이지. Introduction guide 영상

개요

1. Sitemap을 먼저 만들어준다.

2. 최대한 많고 구체적인 정보를 Sitemap에 입력한다. 정보가 많을수록 더욱 정교한 Sitemap을 뽑아낸다.

3. Sitemap은 AI로 복제도 가능하고 직접 텍스트를 추가하거나 페이지를 추가하고 생성할 수도 있다. 얼마든지 수정할 수 있다.

4. Sitemap to WireFrame

사이트맵을 만들고 그 옆에 와이어 프레임 버튼을 누르면 사이트맵을 기준으로 여러가지 와이어 프레임을 추천해준다.

와이어 프레임을 만들었지만 무료계정으로는 피그마로 추출하는게 불가능하다.

아 좀 어지러워서 정리 다시하고 또 써야겠다.

기타 서치글 https://maily.so/dailyprompt/posts/d83b725d https://www.builder.io/blog/ai-figma Figma to React https://producthunt.com/

하나부터 열까지 다 내 스타일대로 작업하면 좋겠지만 프론트라고는 HTML 태그, CSS 깔짝인 거 밖에 없는 내가 혼자 힘으로 웹앱 페이지를 전부 디자인하기에는 시간이 부족하다고 판단했다.

찾아보니 리액트도 이미 많은 사람들이 템플릿을 만들어 놓은 것이 있어서 마음에 드는 템플릿을 활용해 단시간에 있어보이는 웹페이지를 만들어보기로 했다.

지금이야 급해서 기본기를 안 다지고 바로 넘어가지만 시간 날 때마다 기본기 공사를 틈틈이 해둬야 한다.

템플릿과 라이브러리 차이

템플릿은 시작점이나 기본 구조를 제공하는 코드 묶음 라이브러리는 리액트와 함께 사용할 수 있는 도구나 기능 집합을 제공하는 코드 묶음

템플릿이고 나발이고 아예 사용법을 모르니 유튜브에서 사용방법을 찾아봤다. 우선 MUI 강좌로 컴포넌트 사용법부터 맛보기로 했다. 생활코딩 MUI 강좌

개요

1. Component를 여러가지 만든다.
2. Layout으로 Component를 정리한다.
3. Component간의 Interaction을 정리한다.

JS part

모르는 JS 문법 정리

header nav - 다른 부분과 이어지는 링크를 게시할 때 사용하는 태그, 일반적으로 메뉴, 목차, 인덱스 등이 있다. ol - 순서가 있는 목록을 나열할 때 사용하는 태그 article - 문서, 사이트와 완전히 독립적으로 구성할 수 있는 요소를 정의할 때 사용한다. br - 줄 바꿈 태그

MUI 설치

리액트 샘플 코드를 만들고 MUI에서 컴포넌트를 가져와 보자.

npm install @mui/material @emotion/react @emotion/styled

경고 문구가 이것저것 나오길래 뭘 더 설치해야 하나 싶었지만 버전확인 코드로 정상적으로 설치된 것을 확인했다.

버전 확인 코드
npm list @mui/material

컴포넌트 가져오기

설치가 끝났다면 MUI 공식 사이트로 가서 Component 탭을 확인해보자. 사용할 수 있는 컴포넌트가 잔뜩 있다. 우선 버튼 컴포넌트를 사용해본다.

버튼 항목에 들어가보면 버튼 이미지의 샘플 이미지와 간략한 코드를 제공한다. 풀 코드로 오픈해서 확인할 수도 있다. 따로 개발환경 없이도 stackblitz에서 어떻게 실행되는지도 확인해볼 수 있다.

사용하려는 컴포넌트를 import하면 자동으로 버튼에 적용되는 걸 확인할 수 있다.

fix

갑자기 localhost와 연결이 끊어져서 웹 로딩이 안된다.

react script 버전이 낮아서 같은 에러 발생했다는 블로그 참고해서 fix해봤다. [[https://naraewool.tistory.com/350

재설치 코드
npm uninstall react-scripts

npm install react-scripts

npm install --save-dev @jridgewell/sourcemap-codec

이거 하니까 다시 로딩 잘된다!

Button 페이지를 제일 마지막까지 내려보면 API 링크가 나온다 여기 링크를 타고 들어가면 사용할 수 있는 props로 어떤 종류가 있는지 확인할 수 있다.

여러가지 버튼을 사용하고 싶을 땐 어떻게 하냐 ButtonGroup을 사용한다

버튼이 잘 묶였다.

이제 더미 텍스트를 가져와서 사용해보자.

더미텍스트를 그냥 입력하면 글이 화면을 가득 채워 읽기 불편하다. 이렇게 화면이 클 때 가운데로 고정되게 하는 UI로는 대표적으로 네이버가 있다. 이렇게 정리하는 기능들을 모아 Layout이라고 부른다.

Layout

작게 써있는게 카테고리 Container를 써보자

Container

여기서 Fluid는 화면 전체를 Fixed는 화면 일부만을 컨테이너로 가둘 수 있다.

import Container from '@mui/material/Container';

<Container fixed>
    // 가두고 싶은 내용
</Container>

Container로 가두면 반응형 웹페이지를 처음 만들어낸 것이다.

Grid

그리드로 감싸면 컴포넌트 비율을 수평으로 나눌 수 있다. 기본적으로 화면을 12등분하고 초과하면 자동으로 다음 행으로 넘어간다. 이런식으로 Grid container로 감싸고 Grid item으로 한 번 더 감싸서 컴포넌트 구성 값을 12로 맞추어 사용한다.

Dialog

컴포넌트를 통해 다른 컴포넌트로 넘어가기

24분짜리 강의를 직접 실습하고 정리까지 하면서 하려니까 정신 사납고 진행이 더딘 것 같다.

모든 MUI 컴포넌트를 자유자재로 사용하는 것도 꽤나 시간이 걸릴 것 같다.

서말링크

인접리스트 꼴로 사용하는 거 까먹음 그래프 n by n 비워놓고 삽입 미방문 노드의 처리 고민

1트) 런타임에러 재귀함수는 런타임에러가 자주 나므로 sys.setrecursionlimit(10**8) 써줘야 함

dfs는 몇 번을 해도 익숙해지지가 않는구먼

24444 - bfs

bfs가 최고야

7562 - 나이트 이동

현재 위치 - 다음 위치 최소 몇 번의 이동이 필요한가? 나이트 가능한 이동 dx = [1,1, 2,2, -1,-1, -2, -2] dy = [2,-2, 1, -1, 2, -2, 1,-1] 총 8방향 q.pop 방향으로 간다. 아이디어) 도착한 다음 좌표가 이전좌표 거리보다 작아지는 조건만 탐색 초기 00 -> 70 거리제곱 49 다음 12 -> 70 40 다음 -2-1 -> 82 안감 거기에 방문한 체스 보드에 깊이정보까지 한 번에 queue에 저장해주기

풀어보고 나니 짧은 거리만 갈 필요가 없었다. 이미 이동한 다음 좌표가 같으면 깊이를 출력하고 종료하는 조건문에서 검사되기 때문에.. 나이트 방향에 맞춰 이동 + 체스보드 범위 안 + not visited 로 충분했던 것이다. 또 뻘짓했다.

from collections import deque
import math
import sys
input = sys.stdin.readline

dx = [1, 1, 2, 2, -1, -1, -2, -2]
dy = [2, -2, 1, -1, 2, -2, 1, -1]


def bfs(x, y, fx, fy):
    cnt = 0
    q = deque([])
    q.append([x, y, 0])
    v[x][y] = True
    while q:
        cx, cy, steps = q.popleft()
        if cx == fx and cy == fy:
            print(steps)
            return
        for dir in range(8):
            nx, ny = cx+dx[dir], cy+dy[dir]
            if 0 <= nx < l and 0 <= ny < l and not v[nx][ny]:
                v[nx][ny] = True
                q.append([nx, ny, steps + 1])


n = int(input())
for _ in range(n):
    l = int(input())
    ix, iy = map(int, input().split())
    fx, fy = map(int, input().split())

    v = [[False] * (l) for _ in range(l)]

    if ix == fx and iy == fy:
        print(0)
    else:
        bfs(ix, iy, fx, fy)

6137 - 문자열 생성

투포인터 쓰는 문제 투포인터는 또 뭔데

투포인터 연습 문제도 몇 개 풀어보자.

ACDBCB 아이디어 - 펠린드롬

1) 양 끝에서 부터 l, r 다가옴 l과 r이 다르다 = 아스코드 값 중 작은 값을 T에 삽입, 삽입한 부분을 업데이트 (l이면 +1 r이면 -1) 2) 같다 = 두 값이 달라지는 부분까지 탐색 = 달라진다 = 아스키코드 값 중 작은 값을 T에 삽입, 삽잆한 값 업데이트

투 포인터 구현 능력 부족 다른 문제 풀어보기

import sys
input = sys.stdin.readline


def build_string(s):
    l, r = 0, len(s) - 1  # 출발값
    T = []

    while l <= r:  # 좌우 값이 다를 때

        if s[l] != s[r]:
            if s[l] < s[r]:  # 파이썬은 문자열 간의 비교도 가능하다
                T.append(s[l])
                l += 1
            else:
                T.append(s[r])
                r -= 1

        else:
            temp_l, temp_r = l, r
            while temp_l < temp_r and s[temp_l] == s[temp_r]:  # 다를 때까지 찾기
                temp_l += 1
                temp_r -= 1

            if temp_l >= temp_r or s[temp_l] < s[temp_r]:
                T.append(s[l])
                l += 1
            else:
                T.append(s[r])
                r -= 1
    return ''.join(T)


n = int(input())
s = [input().strip() for _ in range(n)]
s = ''.join(s)
result = build_string(s)
# 출력하기 (80글자마다 줄 바꿈)
for i in range(0, len(result), 80):
    print(''.join(result[i:i+80]))

그리디 기초, 매우 쉬운 문제 동전의 합으로 금액 맞추기 가장 큰 돈의 단위부터 나눠나간다 - local optimal

11047 동전 0 
import sys
input = sys.stdin.readline

n, k = map(int, input().split())
lst = []
for _ in range(n):
    x = int(input())
    lst.append(x)

lst.reverse()
ans = 0
for i in range(n):
    if k == 0:
        break
    if k >= lst[i]:
        a = k // lst[i]  # 몫
        k = k % lst[i]  # 나머지로 갱신
        ans += a
print(ans)

1931번 - 회의실 배정

풀이를 봤나요? Y 아이디어 - 당장 해를 생각, 그 최적해로부터 발전 끝나는 시간으로 정렬 -> 시작지점을 기준으로 정렬, 종료 시간을 기준으로 정렬.

import sys
input = sys.stdin.readline

n = int(input())
lst = []
for _ in range(n):
    x, y = map(int, input().split())
    lst.append([x, y])

lst.sort(key=lambda x: x[0])
lst.sort(key=lambda x: x[1])

cnt = 1
end = lst[0][1]
for i in range(1, n):
    if lst[i][0] >= end:
        cnt += 1
        end = lst[i][1]
print(cnt)

11399 - ATM

덧셈의 합 3 1 4 3 2 3+ 3+1+ 3+1+4+ 3+1+4+3+ 3+1+4+3+2 = 결과합이 누적합, 순서에 따라 달라진다. 그리디 인출시간 순으로 정렬하면 가장 적은 값을 가장 많이 누적함 그리디 기초 - 쉬운문제

sum(arr[:i]) 생각했는데 안되서 이중 for문으로 품

import sys
input = sys.stdin.readline

n = int(input())
arr = list(map(int, input().split()))
arr.sort()
rst = 0
# 누적합 구하기
for i in range(len(arr)):  # 5
    for j in range(0, i+1):
        rst += arr[j]
print(rst)

13305 - 주유소

주유비용 계산

예제 필요한 기름양 = sum(도로길이) 처음 도시에서 모두 주유 = 56 = 30원 분할 주유 = 52L + 23L + 41L = 20원 분할 주유2 = 52L + 24L = 18원

입력) 각 주유소 기름값, 도로 길이 출력) 최소 비용 도로 길이가 있어서 6L를 마음대로 분배 못함. [2, 3, 1]

아이디어 - 그리디가...주유소에 도착한 순간에 가장 싼 주유소에서 가장 많이 주유하고 간다. 젤나가 맙소사 전혀 그리디하게 접근하지 못했다..

주유소와 조건에 집하다가 코딩 스타일에서 많이 벗어나버렸다. 뻘 풀이하는데 시간을 꽤 오래썼고 그리디한 방식으로 접근하지도 못했다. 발상을 전혀 하지 못했고 풀이는 잘 봤다고 생각한다.

import sys
input = sys.stdin.readline

n = int(input())
dist = list(map(int, input().split()))  # [2 3 1] N개
cost = list(map(int, input().split()))  # [5 2 4 1] N-1개

c = cost[0]
rst = 0
for i in range(n-1):
    if c > cost[i]:
        c = cost[i]
    rst += c*dist[i]
print(rst)

1541 - 잃어버린 괄호

55-50+40 괄호치기 '-' 나옴 : 다음 '-' 나올 때까지 파싱해서 더함 그래야 빼는 값이 최대가 됨

모르는 부분 5 5 - 5 0 + 4 0 - 2 0 + 3 0 - 10 입력 int형으로 분리

풀이봤냐? Y '-'와 '-'사이를 다 더해서 빼준다 는 건 알겠는데 그 사이를 더하는 방법을 모르겠음

split('-') 사용하면 입력에서 - 단위로 끊어준다. int 정수형을 사용하면 앞자리 불필요한 0이 삭제된다. '-' 기준으로 자르면 처음 숫자 이후로 다 더해서 빼면 됨.

import sys
input = sys.stdin.readline

n = str(input())
m = n.split('-')

ans = 0

x = sum(map(int, m[0].split('+')))
if n[0] == '-':
    ans -= x
else:
    ans += x

for item in m[1:]:
    x = sum(map(int, item.split('+')))
    ans -= x

print(ans)

이해는되는데 왜 그리디인지는 모르겠다.

BFS 8방향

visited 사용 안하는 방법 = BFS 탐색으로 들어간 섬을 0으로 바꿔준다. BFS call 할 때마다 섬의 개수를 1개씩 늘린다 (count += 1)

from collections import deque
import sys
input = sys.stdin.readline

dx = [0, 0, -1, 1, 1, -1, 1, -1]
dy = [1, -1, 0, 0, -1, -1, 1, 1]

ans = []

def bfs(v):
    q = deque()
    q.append(v)

    while q:
        v = q.popleft()
        for dir in range(8):
            ni, nj = v[0]+dx[dir], v[1]+dy[dir]
            if 0 <= ni < h and 0 <= nj < w and graph[ni][nj] == 1:
                graph[ni][nj] = 0
                q.append([ni, nj])

while True:
    w, h = map(int, input().split())
    count = 0
    if w == h == 0:
        break
    graph = []
    for _ in range(h):
        graph.append(list(map(int, input().split())))

    for i in range(h):
        for j in range(w):
            if graph[i][j] == 1:
                bfs([i, j])
                count += 1
    ans.append(count)

print(*ans, sep='\n')

3518 - 공백왕 빈칸

https://www.acmicpc.net/problem/3518 포기

17609 - 회문

회문 0 유사회문 1 일반문 2

문자열 입력 a b b a 0 1 2 3 짝수면 (0+3) / 2 => 1 홀수면 (0+2) / 2 => 1 탐색 기본 rst = 0 ** 조건 추가 ** s u m m u u s "유사 펠린드롬" => 어떤 문자를 제거해야 되는지 알아야 함. x a b b a a b b a x 대칭...양쪽 끝에서 하나씩 보는 거 말고 대칭을 확인하는 다른 방법 .. [펠린드롬 함수] 양쪽에서 확인하면서 온다 만약에 다르다 ex. x, a = str[0] str[4] 그러면 이거 임시로 저장하고 다음거 본다. 그 다음 두 개 중에 x나 a 중 대칭이 되는 것이 있을 것 대칭이 안되는 걸 뺀다 ex. 다음이 a, b = str[1] str[3]

+1 (유사 후보) 왜냐, 유사 펠린드롬은 한 문자 삭제하면 대칭이 됨 i와 -(i+1)가 달라 둘 다 자기 자신을 뺀 나머지 문자가 펠린드롬인지 검사 (자기자신을 제외하고 부분문자열을 합친다.) ex. str[i]빼기 = str[:i] + str[i+1:] 나머지 문자가 펠린드롬이면 유사펠린드롬이고 아니면 일반문이다.

import sys
input = sys.stdin.readline

def is_pd(arr):
    for i in range(len(arr)):
        if arr[i] != arr[-i-1]:
            return False
    return True

t = int(input())
for _ in range(t):
    rst = 0
    str = list(input().rstrip())
    check = len(str) // 2
    if is_pd(str):  # 바로 펠린드롬이면 0
        rst = 0
    else:  # 아니면 유사 혹은 일반문
        for i in range(check):
            if str[i] != str[-(i+1)]:
                outI1 = str[:i]+str[i+1:]
                outI2 = str[:-(i+1)]+str[-i:]

                if is_pd(outI1) or is_pd(outI2):  # 유사펠린드롬이야
                    rst = 1

                else:  # 안되네? = 일반문
                    rst = 2
    print(rst)

1차코드, 시간초과 문제

투포인터를 사용하지 않아서 틀렸다.

투포인터의 개념을 모른다. 공부시작. 파이썬에서는 left, right로 리스트를 옮겨다니면 되는 것 같다. 모든 경우를 테스트하면 O(N^2)이지만 투 포인터를 사용하면 O(N)이 된다.

투 포인터 적용하면 left, right에서 하나씩 줄면서 탐색. 다만, 두 문자가 다를 때 로직이 다름. 이미 지나온 문자는 "다르다"에서 검사 안됨 = 이미 펠린드롬 대칭이다. 그러면 left빼면 left + 1: right, right 빼면 left:right+1 까지만 검사하면 된다.

두 포인터가 최대로 움직여도 2N이므로 시간복잡도는 O(N)

import sys
input = sys.stdin.readline


def is_pd(arr, left, right):
    while left < right:
        if arr[left] != arr[right]:
            return False
        left += 1
        right -= 1
    return True


t = int(input())
for _ in range(t):
    rst = 0
    str = list(input().rstrip())
    left, right = 0, len(str)-1
    while left < right:
        if str[left] != str[right]:
            if is_pd(str, left+1, right) or is_pd(str, left, right-1):
                print(1)
            else:
                print(2)
            break
        left += 1
        right -= 1
    else:
        print(0)

1259 - 팰린드롬수

날먹하기

import sys
input = sys.stdin.readline

def is_pd(arr, left, right):
    while left < right:
        if arr[left] != arr[right]:
            return False
        left += 1
        right -= 1
    return True

while True:
    A = list(map(int, input().rstrip()))
    if A[0] == 0 and len(A) == 1:
        break
    left, right = 0, len(A)-1
    if is_pd(A, left, right):
        print('yes')
    else:
        print('no')

2609 - 최대공약수와 최소공배수

10000이하의 자연수 맞긴한데 지저분함

내코드)

import sys
input = sys.stdin.readline

n, m = map(int, input().split())

# 약수 찾기
s = min(n, m)
a1 = []
a2 = []
for i in range(1, s+1):
    tmp1 = n / i
    tmp2 = m / i

    if int(tmp1) == tmp1:
        a1.append(i)
        a1.append(int(tmp1))
    if int(tmp2) == tmp2:
        a2.append(i)
        a2.append(int(tmp2))

ans = []
for item in a1:
    if item in a2:
        ans.append(item)

S = max(ans)
print(S)

rst = (n*m)//S
print(rst)

다른풀이) 예전에 GCD 많이 풀었는데 다 까먹음. 최대공약수 - i 탐색을 range(min(a,b), 0, -1)로 줄여나감. 둘 다 동시에 나눠질 때 (나머지 연산이 0) 출력하고 종료 최소공배수 - for문을 최소로 돌리는 범위 : range(max(a,b), (a*b)+1), i가 a와 b로 동시에 나눠지면 출력하고 종료.

import sys
input = sys.stdin.readline

n, m = map(int, input().split())

# 최대공약수
for i in range(min(n, m), 0, -1):
    if n % i == 0 and m % i == 0:
        print(i)
        break

# 최소공배수
for i in range(max(n, m), n*m + 1):
    if i % n == 0 and i % m == 0:
        print(i)
        break

모르는대로 마구잡이로 푼 내 코드는 정말로 지저분 그 자체다. ㅠ

풀이봤냐: O

DFS: if (답 리스트 길이) == m: # 조건 print(' '.join(map(str,s))) return for i in range(1,n+1): s.append(i) DFS() s.pop() DFS()

해결 방향: 재귀 DFS call -> 1 - 1234 - (1234) 234 ... for i in range(1,n+1): i가 append되고 다음 바로 dfs call 다음 탐색을 위햇 pop 필요. s.pop() = 마지막 원소 제거 = 재귀 호출 이전 상태로 되돌림

1 -> DFS call -> len(s) == m, print & 종료 -> pop() 하고 다시 돌아야 중복순열 선택..

N과 M (4)

이전 방문 노드보다 작은값은 추가하지 않는다. 이 조건을 어디에 추가해야 될까.

내 풀이) -> 출력은 됨. 비효율적 = 역시나 시간초과 길이가 다 나왔을 때 (DFS 경로탐색 후) 정렬되었는지 여부를 검사한다. 정렬된 경우만 출력한다.

원하는 풀이) 탐색 노드보다 탐색 직전 노드가 크면 s에 넣지 않는다. 아. dfs 탐색에서 for i in range(i, n+1)로 넣어주던걸 start부터 넣어주면 된다. start는 dfs의 인자로 제공한다.

import sys
input = sys.stdin.readline

n, m = map(int, input().split())
s = []


def dfs(start):
    if len(s) == m:
        print(' '.join(map(str, s)))
        return
    for i in range(start, n+1):
        s.append(i)
        dfs(i)
        s.pop()


dfs(1)

N-Queen

내 풀이) 마킹) 이차원 리스트에서 퀸을 놓는다. 퀸의 영향을 받는 모든 리스트 부분을 1로 마킹한다. 놓을 수 있는 리스트 위치에 다시 퀸을 놓는다. (재귀) 조건) 퀸 갯수가 N개를 만족하면 정답으로 1개 카운트한다. => 이 풀이에서는 Backtracking으로 그래프를 못 되돌림. 시간초과

해설) v1,v2,v3로 visited가 3방향으로 Queen 존재여부를 검사한다. row를 한 줄씩 탐색하며 row가 N-1까지 도달하면 ans+=1, 도달하지 못하고 중간에 백트래킹하는 경우, v1,v2,v3를 다시 0으로 돌려놓는다. dfs(row) -> dfs(row+1) 순으로 탐색 진행

추가로 백트래킹의 조건을 달아주는 것이 아니라, dfs탐색 후 if 조건문에 도달하지 못하면 v1,v2,v3를 다시 0으로 되돌리는 것 자체가 백트래킹임.

3방향을 위에만 보면서 한 줄씩 내려간다는 개념을 떠올리지도 못했다. 나는 십자방향 BFS 문제만 풀어서 퀸도 검사 조건에 8방향을 모두 검사해야 한다고 생각햇다. 하지만 이렇게 가면 비효율적으로 모든 노드를 검사하게 된다.

한 줄에 퀸 하나를 놓고 바로 다음 줄로 넘어가버리면, 가로 줄의 불필요한 검사를 스킵할 수 있다. 퀸의 특성과 visited를 여러개 사용할 수 있다는 점. 백트래킹과 DFS를 이해하기 좋은 기본 문제라고 생각한다.

python 시간초과 이슈

ㄷㄱㅈ~ 틀린 이유 visited 선언이슈

from collections import deque
import sys
input = sys.stdin.readline

dx = [-1, 1, 0, 0]
dy = [0, 0, -1, 1]


def bfs(graph, i, j, visited, rain):
    q = deque([])
    q.append([i, j])
    visited[i][j] = True
    while q:
        ci, cj = q.popleft()
        for dir in range(4):
            ni, nj = ci+dx[dir], cj+dy[dir]
            if 0 <= ni < n and 0 <= nj < n and not visited[ni][nj] and graph[ni][nj] > rain:
                q.append([ni, nj])
                visited[ni][nj] = True


n = int(input())
graph = [list(map(int, input().split())) for _ in range(n)]

max_rain = 0
min_rain = 101
for item in graph:
    for i in item:
        max_rain = max(max_rain, i)
        min_rain = min(min_rain, i)

ans = []
for rain in range(min_rain-1, max_rain+1):  # 0~9, min_rain - 1 : 아무 지역도 안 잠김
    count = 0
    visited = [[False]*(n) for _ in range(n)]
    for i in range(n):
        for j in range(n):
            if not visited[i][j] and graph[i][j] > rain:
                bfs(graph, i, j, visited, rain)
                count += 1
    ans.append(count)
print(max(ans))
# rain이 내리면
# graph 원소를 지워야 함.
# bfs 탐색에서 rain보다 큰 값만 탐색하면 되지 않나?

입력 예제로 따라가기

연결요소

connected component

한 노드에 대해서 BFS 돌 때마다 1번씩 카운트

graph[a].append(b) 꼴로 넣는 이유는 연결리스트로 나타내기 위함. 1-2,5 2-5 3-4 4-3,6 5-1 6-4

풀이) 1,N+1까지 탐색한다. 1번 노드를 시작 노드로 넣고 BFS 돌리면 visited로 2,5처리. 2, 5는 이미 방문으로 탐색 ㄴㄴ 그럼 3가서 4도 처리. 그럼 6가도 4는 이미 방문 안셈 (already visited)

from collections import deque
import sys
input = sys.stdin.readline

def bfs(i, graph, visited):
    q = deque()
    q.append(i)
    visited[i] = True
    while q:
        v = q.popleft()
        for node in graph[v]:
            # 검사조건 추가
            if not visited[node]:
                q.append(node)
                visited[node] = True

N, M = map(int, input().split())
graph = [[]*(N+1) for _ in range(N+1)]
visited = [False]*(N+1)
count = 0
for _ in range(M):
    a, b = map(int, input().split())
    graph[a].append(b)
    graph[b].append(a)

for i in range(1, N+1):
    if not visited[i]:
        bfs(i, graph, visited)
        count += 1
print(count)

bfs에 검사 조건을 어디 넣어줄 지 잘 생각해보자. bfs로 날먹하지 말고 dfs도 연습 같이 해라. 그치만 재귀는 너무 싫은 걸.

걷기 +- 1 순간이동 2*X 가장 빠른 시간?

5-10-9-18-17 5회

접근 방법이 안 떠오름 일단 따라가봐라

5 -> 4 6 10 -> 3 8 / 7 12 / 9 11 20 (이미 방문한 번호는 제외됨 (visited)) -> 2 / 16 / 14 / 13 24 / 18 22 / 19 21 40 -> 1 3 / 15 17 (탐색 종료)

BFS visited = [] 문제 조건 따라 20만개로 설정

BFS 공략

• Queue, Visited
• 초기 노드 넣기
• current node = q.pop()
• 방향 넣기
• 범위조절
• next node = q.append(nn) (미방문시)

수도코드
bfs(s,e):
    [1] q생성, v생성
    [2] q.append(s) v[s] = 1
    [3] while q:
             c= q.pop(0)
            # pop했는데 답이야 출력하고 종료
            # 3방향 => [c-1, c+1, c*2]
            # 범위 내 0 <= n <= 200000
                q.append(next)
                visited[n] = visited[c] + 1 # 깊이 더하기

전체코드
import sys
from collections import deque
input = sys.stdin.readline


def bfs(s, e):
    global visited
    q = deque()
    q.append(s)
    visited[s] = 1
    while q:
        cn = q.popleft()
        if cn == e:
            return visited[cn]-1
        for n in (cn-1, cn+1, cn*2):
            if 0 <= n <= 200000 and visited[n] == 0:
                q.append(n)
                visited[n] = visited[cn] + 1


N, K = map(int, input().split())
visited = [0]*200001
print(bfs(N, K))