반응형

형변환

명시적 형변환

int i = 300;
byte b = (byte) i; // 값 손실 발생

묵시적 형변환

byte b = 10;
int i = b; // 값 손실 없음

배열 선언

1차원 배열

int points[] = new int[3];

2차원 배열

int[][] intArray = new int[4][];

문자열을 문자 배열로 변환

String a = new String("123");
char[] charArray = a.toCharArray();

UML

  • private: 빨간색
  • protected: 노란색
  • public: 녹색
  • default: 파란색

객체지향 프로그래밍

특징

  1. 추상화
  2. 다형성
  3. 상속
  4. 데이터 은닉과 보호

객체와 클래스

  • 객체: 클래스를 데이터 타입으로 메모리에 생성되어 실제로 동작하는 것
  • 클래스: 객체를 정의해 놓은 것

생성자

Person person = new Person();
Person person = new Person("name");

this 키워드

  • 객체 자신을 가리킴
  • 로컬 변수와 멤버 변수를 구분할 때 사용
public Person(String name) {
    this.name = name;
}

public Person() {
    this("name");
}

상속

public class Child extends Parents

단일 상속

  • 자바는 단일 상속만 지원 (다이아몬드 상속 문제 방지)

오버라이딩

public class Person {
    void kick() {
        // 차다.
    }
}

public class Player extends Person {
    @Override
    void kick() {
        // 공을 차다
    }
}

조건

  • 메서드 이름, 매개변수, 리턴 타입 동일
  • 접근 제한자는 부모와 같거나 더 넓어야 함
  • 부모보다 더 큰 예외는 던질 수 없음

접근 제한자

  1. public: 모든 클래스에서 접근 가능
  2. protected: 동일 패키지 또는 상속 관계의 클래스에서 접근 가능
  3. private: 동일 클래스 내에서만 접근 가능 (캡슐화)
  4. default: 동일 패키지 내의 클래스에서만 접근 가능

Singleton 패턴

public class Singleton {
    private static Singleton instance = new Singleton();

    private Singleton() {}

    public static Singleton getInstance() {
        return instance;
    }
}

다형성

  • 하나의 객체가 여러 형태를 가질 수 있는 성질
public void println(Object o) {}
public void println(Person p) {}

제네릭

정의

  • 다양한 타입의 객체를 다루는 메서드, 컬렉션 클래스에서 컴파일 시 타입 체크
public interface Interface_name<T> {}

형인자

  • T: 타입
  • E: 요소
  • K: 키
  • V: 값

주의할 점

  1. 프라이미티브 타입 사용 불가
  2. 타입 캐스팅 시 런타임에 타입 정보 유지되지 않음
  3. 정적 컨텍스트에서 제네릭 사용 불가
  4. 제네릭 배열 생성 불가
  5. 제네릭 타입 인스턴스 생성 불가

자바의 와일드카드 자료형

와일드카드(Wildcard): 불특정 타입을 나타내기 위해 사용 (?)

  1. 무제한 와일드카드 (?): 어떤 타입이라도 허용
  2. 상한 경계 와일드카드 (? extends T): 특정 타입이나 그 하위 타입을 허용 (읽기 전용)
  3. 하한 경계 와일드카드 (? super T): 특정 타입이나 그 상위 타입을 허용 (쓰기 전용)

Collection 프레임워크

컬렉션(Collection): 여러 개의 객체를 모아서 관리하는 자바의 프레임워크

주요 인터페이스

  1. Collection: 컬렉션의 기본 인터페이스
  2. List: 순서가 있는 컬렉션, 중복 허용 (ArrayList, LinkedList)
  3. Set: 순서가 없는 컬렉션, 중복 불가 (HashSet, TreeSet)
  4. Queue: FIFO 방식의 컬렉션 (LinkedList, PriorityQueue)
  5. Map<K, V>: 키-값 쌍으로 이루어진 컬렉션 (HashMap, TreeMap)

주요 구현 클래스

  1. ArrayList: 가변 크기 배열, 빠른 인덱스 접근
  2. LinkedList: 이중 연결 리스트, 빠른 삽입/삭제
  3. HashSet: 해시 테이블, 중복 불가
  4. TreeSet: 이진 검색 트리, 정렬된 순서 유지
  5. HashMap: 해시 테이블, 키 중복 불가, 값 중복 가능

정렬 (Sort)

자바에서 배열이나 컬렉션을 정렬하는 방법

1. 배열 정렬

Arrays.sort() 메서드

  • 기본형 배열 정렬
    int[] numbers = {5, 3, 8, 1, 2};
    Arrays.sort(numbers);
  • 객체 배열 정렬
    String[] names = {"John", "Alice", "Bob"};
    Arrays.sort(names);
  • Comparator를 사용한 정렬
    Arrays.sort(names, (s1, s2) -> s2.compareTo(s1));

2. 컬렉션 정렬

Collections.sort() 메서드

  • List 정렬
  • List<Integer> numberList = Arrays.asList(5, 3, 8, 1, 2); Collections.sort(numberList);
  • 객체 List 정렬 (Comparable 사용)
  • public class Person implements Comparable<Person> { private String name; private int age; @Override public int compareTo(Person other) { return this.age - other.age; } } List<Person> people = Arrays.asList(new Person("John", 25), new Person("Alice", 30)); Collections.sort(people);
  • Comparator를 사용한 정렬
  • Collections.sort(people, (p1, p2) -> p1.name.compareTo(p2.name));

3. 스트림을 사용한 정렬 (Java 8 이상)

  • 기본 정렬
  • List<Integer> numberList = Arrays.asList(5, 3, 8, 1, 2); List<Integer> sortedList = numberList.stream().sorted().collect(Collectors.toList());
  • Comparator를 사용한 정렬
  • List<Person> sortedPeople = people.stream() .sorted(Comparator.comparing(Person::getName)) .collect(Collectors.toList());

람다 표현식 (Lambda Expressions)

람다 표현식: 익명 함수를 간결하게 표현하는 방법

문법

(parameters) -> expression
(parameters) -> { statements; }

람다식 정렬

List<String> list = Arrays.asList("B", "A", "C");
Collections.sort(list, (s1, s2) -> s1.compareTo(s2));

List<Person> people = Arrays.asList(new Person("John"), new Person("Alice"));
Collections.sort(people, (p1, p2) -> p1.getName().compareTo(p2.getName()));

스트림 (Stream)

스트림(Stream): 컬렉션을 처리하는 함수형 프로그래밍 API

주요 특징

  • 연속된 요소: 컬렉션의 요소를 하나씩 처리
  • 함수형 스타일: 선언적이고 함수형 프로그래밍 스타일
  • 지연 연산: 최종 연산 시에만 중간 연산 수행
  • 무상태 연산: 각 요소를 독립적으로 처리

스트림 원리

  • 파이프라인: 소스 -> 중간 연산 -> 최종 연산
  • 중간 연산: 지연 연산, 최종 연산 시 수행

스트림 연산 예시

  • 스트림 생성
  • List<String> names = Arrays.asList("John", "Alice", "Bob"); Stream<String> stream = names.stream();
  • 중간 연산 (필터링, 변환, 정렬)
  • List<String> filteredNames = names.stream() .filter(name -> name.startsWith("A")) .collect(Collectors.toList());
  • 최종 연산 (반복, 집계)
  • names.stream().forEach(name -> System.out.println(name));
    long count = names.stream().filter(name -> name.startsWith("A")).count();
---

### 예외처리 (Exception Handling)

**예외처리**: 예외 상황을 처리하여 프로그램의 비정상 종료를 방지

### 주요 개념과 키워드

1. **try 블록**
   - 예외가 발생할 가능성이 있는 코드 포함
   ```java
   try {
       // 예외 발생 가능 코드
   }
  1. catch 블록
    • 예외가 발생하면 처리
      try {
        // 예외 발생 가능 코드
      } catch (ExceptionType e) {
        // 예외 처리 코드
      }
  2. finally 블록
    • 예외 발생 여부와 관계없이 항상 실행
      try {
        // 예외 발생 가능 코드
      } catch (ExceptionType e) {
        // 예외 처리 코드
      } finally {
        // 항상 실행되는 코드
      }
  3. throw 키워드
    • 명시적으로 예외 발생
      throw new ExceptionType("예외 메시지");
  4. throws 키워드
    • 메서드가 특정 예외를 던질 수 있음을 선언
      public void myMethod() throws ExceptionType {
        // 예외 발생 가능 코드
      }

예외 계층 구조

  • Checked Exception: 컴파일 시점에서 반드시 처리해야 하는 예외 (IOException, SQLException)
  • Unchecked Exception: 런타임 시점에서 발생하는 예외 (NullPointerException, ArrayIndexOutOfBoundsException)

파일 입출력 (File I/O)

파일 입출력: 파일을 읽고 쓰는 작업

주요 클래스 및 인터페이스

  1. java.io 패키지
    • File: 파일 및 디렉토리 경로명 표현
    • FileReader: 파일을 문자 스트림으로 읽음
    • FileWriter: 파일을 문자 스트림으로 씀
    • BufferedReader: 문자 입력 스트림을 버퍼링하여 효율적으로 읽음
    • BufferedWriter: 문자 출력 스트림을 버퍼링하여 효율적으로 씀
    • FileInputStream: 파일을 바이트 스트림으로 읽음
    • FileOutputStream: 파일을 바이트 스트림으로 씀

기본적인 파일 읽기 및 쓰기 예제

문자 스트림

  • 파일 쓰기 (FileWriter)
  • try (FileWriter writer = new FileWriter("example.txt")) { writer.write("Hello, world!"); } catch (IOException e) { e.printStackTrace(); }
  • 파일 읽기 (FileReader)
  • try (FileReader reader = new FileReader("example.txt")) { int data; while ((data = reader.read()) != -1) { System.out.print((char) data); } } catch (IOException e) { e.printStackTrace(); }

바이트 스트림

  • 파일 쓰기 (FileOutputStream)
  • try (FileOutputStream output = new FileOutputStream("example.bin")) { output.write("Hello, world!".getBytes()); } catch (IOException e) { e.printStackTrace(); }
  • 파일 읽기 (FileInputStream)
  • try (FileInputStream input = new FileInputStream("example.bin")) { int data; while ((data = input.read()) != -1) { System.out.print((char) data); } } catch (IOException e) { e.printStackTrace(); }

컴파일 에러

int i;
System.out.println(i); // 초기화 안한 컴파일 오류

런타임 에러

String s = null;
System.out.println(s.length()); // NullPointerException

Teacher t = (Teacher) person; // ClassCastException

Call By Value

String s = new String("hello");
s.concat("world");
System.out.println(s); // hello

s = s.concat("world");
System.out.println(s); // helloworld

인터페이스 VS 추상클래스

  인터페이스 추상클래스
공통점 추상화: 구체적인 구현 없이 메서드 선언만 포함 가능
다형성 지원: 여러 클래스가 공통된 인터페이스나 추상 클래스를 구현함으로써 동일한 타입으로 다룰 수 있음
상속 가능
차이점 구현된 메서드 포함 가능, 필드 가질 수 있음, 생성자 포함 구현 포함 안함 (default 메서드는 예외), 필드 가질 수 없음
단일 상속 다중 상속
extends implements
공통된 기능을 공유하면서 일부 메서드의 구체적인 구현을 제공하기 위해 사용 클래스 간의 계약을 정의하고, 클래스가 반드시 구현해야 하는 메서드를 명시하기 위해 사용

List vs Set vs Map

List

  • 입력 순서가 있는 데이터의 집합
  • 순서가 있으므로 데이터 중복 허용
  • 구현 클래스: ArrayList, LinkedList

Set

  • 입력 순서를 유지하지 않는 데이터의 집합
  • 순서가 없으므로 데이터를 구별할 수 없음
  • 중복 불가
  • 구현 클래스: HashSet, TreeSet

Map

  • Key, Value의 쌍으로 데이터를 관리하는 집합
  • 순서는 없고 Key의 중복 불가, Value 중복 가능
  • 구현 클래스: HashMap, TreeMap
반응형
반응형

배경


사실 다국어 언어 메뉴를 만들면서 초기구상은 nexti18n 을 사용하기로 했지만, 배움의 부담에 못이겨 하드코딩으로 진행했다. 그러다보니 유지보수는 물론,, 가독성이 완전 제로제로제로였다. 그래서 이를 잘 관리하기 위해 기존 기획했던 nexti18n 을 제대로 적용해보려고 한다.

 

처음부터 잘못됐던


나는 초반에 nexti18n 라이브러리를 적용하기 위해 설치를 했으나 구글링을 통해 제대로 확인해보니 Next13/14 App 기반 환경은 기존 라이브러리를 지원하지 못한다고 한다!?!

 

 

대충 app 에서는 지원하지 않는다는 의미

 

대신 i18next, react-i18next, i18next-resources-to-backend 라이브러리를 사용해 구성하라고 한다.

npm install i18next react-i18next i18next-resources-to-backend

https://locize.com/blog/next-app-dir-i18n/

 

i18n with Next.js 13/14 and app directory / App Router (an i18next guide)

Looking for a way to internationalize your Next.js 13/14 project with the new app directory / App Router paradigm? Then this guide is for you!

locize.com

 

해당 블로그를 따라하라고 하길래 보면서 열심히 따라쳤다. 하지만,, 2년전 자료를 그 때 깨닫고 하지 말았어야 했는데..

 

결론은 언어를 동적 링크를 생성해 주소를 호출하는 과정속에서 알 수 없는 404 에러가 계속 나와 다시 next i18n 에 대해 검색을 진행했다.

돌아도 한참 돌아갔던


조금더 검색을 해보니 next-intl 이라는 라이브러리가 존재한다는것을 알게되었다..! 아뿔싸 나의 내다버린 3시간.. 하지만 개발이란 원래 이런것..

 

설치과정을 잠깐 보자면

설치과정

0. 상황

├── messages (1)
│   ├── en.json
│   └── ...
├── next.config.mjs (2)
└── src
    ├── i18n.ts (3)
    ├── middleware.ts (4)
    └── app
        └── [locale]
            ├── layout.tsx (5)
            └── page.tsx (6)

샘플 폴더 구조는 다음과 같다.

 

1. 라이브러리를 설치한다.

npm install next-intl

 

2. 파일 셋업하기

1) messages/en.json

{ "Index": { "title": "Hello world!" }}
  • 각 언어마다 json 파일 형식으로 글에 들어갈 내용을 작성한다.

2) next.config.mjs

import createNextIntlPlugin from 'next-intl/plugin'; 
const withNextIntl = createNextIntlPlugin(); 
/** @type {import('next').NextConfig} */
const nextConfig = {}; 
export default withNextIntl(nextConfig);
  • next-intl 을 사용하기위한 플러그인을 설정하는 코드다.

3) i18n.ts

import {notFound} from 'next/navigation';
import {getRequestConfig} from 'next-intl/server';

// Can be imported from a shared config
const locales = ['en', 'ko'];

export default getRequestConfig(async ({locale}) => {
  // Validate that the incoming `locale` parameter is valid
  if (!locales.includes(locale as any)) notFound();

  return {
    messages: (await import(`../messages/${locale}.json`)).default
  };
});
  • next-intl은 요청 범위의 구성 객체를 생성하여 사용자의 언어에 따라 메시지 및 기타 옵션을 제공할 수 있으며, 이를 서버 컴포넌트에서 사용할 수 있습니다.

4) middleware.ts

import createMiddleware from 'next-intl/middleware';

export default createMiddleware({
  // A list of all locales that are supported
  locales: ['en', 'ko'],

  // Used when no locale matches
  defaultLocale: 'en'
});

export const config = {
  // Match only internationalized pathnames
  matcher: ['/', '/(ko|en)/:path*']
};
  • middleware 에서는 요청에 따른 언어가 매칭되는지 확인하고 리다이렉트하거나 리라이트 하는 역할을 한다.

5) app/[locale]/layout.tsx

import {NextIntlClientProvider} from 'next-intl';
import {getMessages} from 'next-intl/server';

export default async function LocaleLayout({
  children,
  params: {locale}
}: {
  children: React.ReactNode;
  params: {locale: string};
}) {
  // Providing all messages to the client
  // side is the easiest way to get started
  const messages = await getMessages();

  return (
    <html lang={locale}>
      <body>
        <NextIntlClientProvider messages={messages}>
          {children}
        </NextIntlClientProvider>
      </body>
    </html>
  );
}

 

6) app/[locale]/page.tsx

import {useTranslations} from 'next-intl';

export default function Index() {
  const t = useTranslations('Index');
  return <h1>{t('title')}</h1>;
}
  • [locale] 이라는 파일 명을 통해 미들웨어에서 매칭된 언어인 경우 주소값을 가질 수 있다.

결과


테스트 성공!

기존 웹사이트에 적용하기


이제 next-intl 을 적용되었으니 기존 사이트에 추가해야한다. locale (언어 변수) 를 전역으로 관리해야한다는 아이디어가 생겨 상태를 관리할 수 있는 LanguageContext.tsx 를 만들었다.

// context/LanguageContext.tsx

"use client"
import { createContext, useContext, useState, ReactNode } from 'react';
import { Language } from '../types';

interface LanguageContextProps {
  selectedLanguage: Language;
  setSelectedLanguage: (language: Language) => void;
}

const LanguageContext = createContext<LanguageContextProps | undefined>(undefined);

interface LanguageProviderProps {
  children: ReactNode;
  initialLocale: Language;
}



export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children, initialLocale }) => {
  const [selectedLanguage, setSelectedLanguage] = useState<Language>(initialLocale);

  return (
    <LanguageContext.Provider value={{ selectedLanguage, setSelectedLanguage }}>
      {children}
    </LanguageContext.Provider>
  );
};



export const useLanguage = (): LanguageContextProps => {
  const context = useContext(LanguageContext);
  if (context === undefined) {
    throw new Error('useLanguage must be used within a LanguageProvider');
  }
  return context;
};

 

로직

 

1. layout.tsx 에서 locale 을 다룰 수 있는 Provider를 만들어 감싼다.

<html lang={locale}>
      <body>
        <NextIntlClientProvider messages={messages}>
          <LanguageProvider initialLocale={locale}>
          {children}
          </LanguageProvider>
          <div id="global-modal"></div>
          <div id="howtoeat-modal"></div>
        </NextIntlClientProvider>
      </body>
    </html>

 

이렇게 감싸게 되면 LanguageProvider 에 저장된 selectedLanguage 변수로 locale 을 children 에 전달하는 방법을 통해 언어 변수를 관리할 수 있다.

 

2. LanguageProvider selectedLanguage

export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children, initialLocale }) => {

  const [selectedLanguage, setSelectedLanguage] = useState<Language>(initialLocale);

  return (
    <LanguageContext.Provider value={{ selectedLanguage, setSelectedLanguage }}>
      {children}
    </LanguageContext.Provider>
  );
};

 

여기서 저장된 selectedLanguage 는 다음 함수를 호출함으로 외부에서 사용할 수 있다.

 

3. useLanguage

export const useLanguage = (): LanguageContextProps => {
  const context = useContext(LanguageContext);
  if (context === undefined) {
    throw new Error('useLanguage must be used within a LanguageProvider');
  }
  return context;
};
const {selectedLanguage, setSelectedLanguage} = useLanguage();
const router = useRouter();
const pathname = usePathname();

  useEffect(() => {
    const currentLocale = pathname.split('/')[1] as Language;
    if (currentLocale && ["ko", "en", "ja", "th", "ch"].includes(currentLocale)) {
      setSelectedLanguage(currentLocale);
    } else {
      console.error(`Invalid language in path: ${currentLocale}`);
    }

  }, [pathname, setSelectedLanguage]);

 

위와 같이 page.tsx 에서 selectedLanguage 변수에 useLanguage() 로 context 를 전달한다. 이렇게 만든다면 드롭다운을 통해 언어를 선택하고 , 선택된 언어는 Context 로 관리를 할 수 있다.

다음 할 일


이제 복잡한 건 끝났고, 언어별 json 파일을 만들어서 좀 더 보기좋은 코드로 만드는 일만 남았다. 상당히 귀찮고 복잡한 일일 것으로 예상되지만 이것 역시 내가 극복 해야할일...

 

또 생각이 든건데 LanguageContext가 아닌 redux 를 사용해도 뭔가 될 것 같은 기분이다. redux에 대해 제대로 배우질 않아서 적용하지 않았는데 나중에 적용해봐도 될 것같다.

반응형
반응형

배경


메뉴의 상세 정보 모달을 띄우게 되면 대표 이미지가 나오게 된다. 이때, 다양한 사진을 제공하는게 좋을 것 같아 Carousel 을 적용해 보려고 한다.

 

어떤걸 쓸까?


  1. 직접구현
  2. Swiper

우선은 문서화가 잘되어 있고 배우기 편하고 설치가 간단한 Swiper 를 대중적으로 많이 사용하는 것 같은 분위기처럼 보인다. 마음 같아서는 직접 구현하면서 공부하고 싶지만 나에게 그런 시간은 존재하지 않는다... 얼른 이 프로젝트를 끝내고 싸피에 집중해야할 것 같다.

 

또한, 좀 찾아보니 구글링을 좀만 하더라도 대부분 Swiper 얘기를 하는거보니 대세인것 같다. 나는 대세를 따르겠다.

 

Swiper


https://swiperjs.com/get-started

 

Swiper - The Most Modern Mobile Touch Slider

Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior.

swiperjs.com

 

공식문서

 

$ npm install swiper

 

우선 swiper 를 설치한다.

// import Swiper JS
import Swiper from 'swiper';
// import Swiper styles
import 'swiper/css';

const swiper = new Swiper(...);

 

swiper 는 위와 같이 선언해 사용가능하다. 다시 해보면 알겠지만 위 코드로는 뭔가가 애매하다는 것을 알 수 있다.

 

하지만, 공식문서에 나온 방법으로는 먼가 잘 안되서 Swiper 제작팀이 만든 데모 페이지를 통해 솔루션을 얻을 수 있게 되었다.

How to?


import React, { useRef, useState } from "react";

// Import Swiper React components

import { Swiper, SwiperSlide } from "swiper/react";

// Import Swiper styles

import "swiper/css";

import "./styles.css";

export default function App() {
  return (
    <>
      <Swiper className="mySwiper">
        <SwiperSlide>Slide 1</SwiperSlide>
        <SwiperSlide>Slide 2</SwiperSlide>
        <SwiperSlide>Slide 3</SwiperSlide>
        <SwiperSlide>Slide 4</SwiperSlide>
        <SwiperSlide>Slide 5</SwiperSlide>
        <SwiperSlide>Slide 6</SwiperSlide>
        <SwiperSlide>Slide 7</SwiperSlide>
        <SwiperSlide>Slide 8</SwiperSlide>
        <SwiperSlide>Slide 9</SwiperSlide>
      </Swiper>
    </>
  );
}

 

8개의 슬라이드를 출력하는 데모 코드다. Swiper 컴포넌트의 mySwiper 는 Swiper 에서 제공하는 기본 css 파일에 있는 클래스 인 것 같다. ./styles.css 에는 존재하지 않아 그렇게 보인다.

 

이 코드만 적용하게 된다면 잘 움직이는 캐러셀이 만들어진다! 두둥

 

하지만, 나는 밑에 있잖아 그거 인덱스마다 동그라미 움직이는거 먼지알지?? 그거 하고 싶어요@ 찾아보니까 Paging 이라는 속성이 있었다! 적용하기 위해 위의 코드를 살짝쿵 수정해보았다.

import "swiper/css";
import 'swiper/css/pagination';
import { Swiper, SwiperSlide } from "swiper/react";
import { Pagination} from 'swiper/modules';

    <Swiper pagination={true} modules={[Pagination]} className="mySwiper">
        <SwiperSlide>Slide 1</SwiperSlide>
        <SwiperSlide>Slide 2</SwiperSlide>
        <SwiperSlide>Slide 3</SwiperSlide>
        <SwiperSlide>Slide 4</SwiperSlide>
        <SwiperSlide>Slide 5</SwiperSlide>
        <SwiperSlide>Slide 6</SwiperSlide>
        <SwiperSlide>Slide 7</SwiperSlide>
        <SwiperSlide>Slide 8</SwiperSlide>
        <SwiperSlide>Slide 9</SwiperSlide>
      </Swiper>

 

이렇게 하면 예쁜 캐러셀이 만들어집니다~

 

https://swiperjs.com/demos#navigation

 

Swiper Demos

Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior.

swiperjs.com

 

데모는 여기서 확인하면 이해하기 쉽게 리액트, 뷰 등 코드를 제공하니 꼭 둘러보라

결과물


쏘 굿~

 

아직은 이미지가 더 없어 추가하지 못했고, 캐러셀에 이미지를 리스트화해서 넣어야 하는데 메인 화면 코드가 상당히 지저분해서 조금 고민을 한 후 수정을 해야할 것 같다.. 이런..

반응형
반응형

배경

2024년 6월이 지나 7월이 되었다. 지원회고라는 단어는 곧 내가 취직을 못했다는 사실.. 첫 취준은 실패로 돌아갔다. 하지만, 그렇게 실패는 아니다. 싸피에 합격해 취업준비를 효율적으로 할 수 있다는 사실에 감사 또 감사할 따름이다. 물론, 아침에 일찍일어나고 일찍자는 생활을 적응하기엔 아직은 너무나도 피곤쓰 하다ㅠㅠㅠ 아 진짜 2호선 좀 어떻게 해줘.. 출근길 낑겨 타는 사람들의 모습이 너무 안쓰럽고 그런 나도 안쓰럽다.

 

각설하고, 내가 이번 24년 상반기 시즌 총 정리를 해보려고 한다. 과연 결과는 어떻게 되었을지??

지원 결과

무수히 많은 서류탈락

 

지원 37 (부트캠프 + 4) 서류합격 6 (부트캠프 + 3), 코테합격 2 (부트캠프 + 3) 면접탈락 2

 

서류합격률 (6/37 = 16%) ..

 

하 진짜 기가 막히고 코가막히는 서류 합격률 아닌가..? ㅎㅎ.. 물론 4학년 2학기 서합률보다는 낫다야하지만 ㅠㅠㅠ 정말 슬프다. 그래도 어느정도 서류 쓰는 감을 잡았으니 싸피하면서 자소서 첨삭도 받고 한다면 괜찮지 않을까 하는 생각..

코딩테스트

언제쯤 달까 플레
우상향 하는 나의 그래프

 

백준은 24년들어 골3~4 에서 골1까지 올렸다. 막 어려운 문제를 푼다기보단 골드 위주로 다양한 알고리즘을 풀려고 노력했다. 바킹독 선생님 강의를 듣고 연습문제를 푸는 형식으로 진행했는데 중간에 면접도하고 코테도 보다보니 중간부터 듣지 못하고 있다. 죄송합니다. ㅎㅎ 싸피 1학기 목표는 플레티넘에 도달하는 것이다. 정말 못하는 DP 좀 잘하고 싶다. 또, 하루에 1 문제 풀고싶은데 스타트캠프를 하고 있는 지금 과연 그게 가능한 것인지 좀 의심스럽다. 내가 게으른 것도 큰 것 같기도 하다.

총 평

전체적으로 내 결과를 쭉 지켜봤을 때 나름 괄목할만한 성장을 했다고는 생각하지만 1승이 없다. 서류는 한 번의 유료 첨삭과 삼성 자소서를 쓰면서 다양한 사람들에게 첨삭을 받은 뒤로 조금씩 퀄리티가 상승하고 있는 것 같다. 싸피에서 만들 경험과 내가 개인적으로 경험을 채우고 서류를 보완한다면 가능성이 있을 것 같다. 코딩테스트 역시 삼성 기준으로 시뮬레이션을 준비하고 잘 못하는 문자열 DP 를 보완한다면 괜찮을 것 같다.

 

마지막으로, 하반기 때 목표를 정하고 그것을 좀 실천해보려고 한다.

2024 하반기 목표

  1. 백준 플레티넘 5달성
  2. 경험 리스트 재작성
  3. 서류 합격률 30% 달성
  4. 열정도 프로젝트 마무리하고, 포트폴리오 사이트 제작
  5. 자바스크립트 딥다이브 스터디 만들기

너무 많은가..? 하지만 목표가 클수록 뭐라도 하겠지 !!! 아자아자 한 번 해보자!!

반응형

+ Recent posts