나는 Nexters 22기 회원으로서 모든 세션 일정을 마무리했다.

이에 나의 활동을 돌아보며 회고를 하려고 한다.

 

나는 싸피 활동 기간에 프로젝트를 경험했었지만 1학기의 나는 게을렀고, 2학기의 나는 조급했다.

싸피는 취업을 위한 프로그램이기 때문에 실제로 교육생들 중에는 취업 준비로 프로젝트에 소홀하거나 취뽀하여 퇴소하는 경우가 많다.

팀원이 취업으로 퇴소함으로 팀원 구성에 변동이 생기고, 어느새 번아웃이 와서 프로젝트에 집중을 하지 못하는 경우가 있었다.

하지만 넥스터즈는 중간에 나가는 인원이 웬만하면 없고, 취준생일 때보다는 편하게 프로젝트에 집중할 수 있겠다는 생각이 들었다.

그리고 싸피활동 내내 있었던 아쉬움을 덜어내기 위함 등 여러가지 이유로 넥스터즈에 지원하게 되었다.

 

모집

동아리 활동 모집이지만 자소서 항목이 생각보다 많았다.

많은 지원자들 중에서 합격/불합격을 가려내야하니 요구하는 것들이 많을 수밖에 없다고 생각했다.

내가 합격이 되기위해서는 어떤 부분을 어필해야할지, 다른 지원자들보다 내가 앞선다고 생각하는 부분이 뭔지 생각했지만

무엇보다도 꾸준함을 어필하는게 좋겠다고 생각했다.

 

현재 나의 커밋내역

나는 2021년 7월 26일부터 1일 1알고리즘을 실천하고 있다.

난이도와 상관없이 하루에 한 문제는 무조건 풀어야한다는 나만의 규칙을 만들었다.

그날 푼 문제를 깃허브에 바로 업로드 하기 때문에 자연스럽게 1일 1커밋도 실천되었다.

지원 당시 400일 넘게 지속중이었고, 이것이 나의 꾸준함을 증명할 것이라고 생각했다.

커밋을 하나하나 찍어본다해도 상관없었다. 진짜 한 문제씩 다 올린게 맞으니까.

 

https://imksh.com/108

 

넥스터즈 지원자 서류 검토 후기

넥스터즈라는 IT 연합동아리 회장을 하고 있으며, 신규 회원 모집 서류 검토 단계에서 가졌던 생각을 담아 둔 글입니다. 그렇기에 내용이 다소 주관적일 수 있는 점 유의해 주시기 바랍니다. 부

imksh.com

결과적으로도 이를 운영진분들이 좋게 봐주셔서 합격한 것 같았다.

위 CEO님의 블로그 글에서 생각보다 나의 멘탈을 걱정하셨다는 말을 들었지만 나는 진짜 아무렇지도 않았다.

내 멘탈이 무너진건 면접 들어가자마자 CEO님이 등장했을때다. 형이 왜 거기서 나와?

머릿속이 텅 빈다는 느낌을 이때 받게 되었다. 면접때 내가 무슨말을 했었는지 기억이 안나지만 합격해서 정말 다행이다.

면접 때 기억에 남는 게 있었다면 정말 모든것을 다 뒤져본것처럼 내 레포에 없는 프로젝트를 언급해 주시더라. 소름돋았다.

 

정규 세션

1주차때 아이디어 소개 시간 이후에 팀빌딩이 이루어졌다.

생각보다 백엔드를 필요로하는 팀이 많지 않아서 당황스러웠던 기억이 있다.

나는 개인의 기술적인 성장이 주 목표였기에 네트워킹 목적이 7~80%이상 차지할 것 같은 팀들은 과감하게 제외했다.

그렇게 들어가고싶은 팀이 두 팀정도 있었고, 첫번째로 희망한 팀에 들어가게 되어 너무 좋았다.

PM님이 멤버를 뽑을때 Java Spring 하시는분으로 맞춰서 뽑아주셔서 너무 감사했다.

 

정규세션은 알차게 진행된 것 같다.

팀빌딩, 작업부터 UT, 컨퍼런스, 넥버닝, 레크레이션 등 여러 세션이 있었다.

저번기수는 오후부터 다음날 오전까지 넥나잇이 있었다고 하지만 이번기수는 오전부터 저녁까지 진행하는 넥버닝으로 교체되어 진행되었다.

나는 밤을 새는것보다는 오전부터 작업하는걸 더 선호하기 때문에 만족했다.

물론 이번기수 때는 새벽에 작업하는날이 많긴 했지만.. ^^

이렇게 보니 2달이라는 시간동안 정말 열심히 하긴 한 것 같다.

 

이번 활동에서 세웠던 목표로는 새로운 기술을 활용해보는것과 배포를 내가 맡아서 진행하는 것이었다.

우선 기술로는 firebase console에서 dynamic link를 등록하고, 앱에서 링크공유가 될 수 있도록 구현을 완료했다.

물론 클라이언트와 통신은 되지않아 기능 테스트를 진행하지 못한건 아쉬움에 남는다.

푸쉬알림을 위해 Messaging도 활용했지만 다른분이 맡았어서 추가적인 학습이 필요할 것 같다.

그리고 나는 싸피 교육생시절에 배포를 경험한 적이 없다. 다 다른 팀원분이 맡아주셨다.

실습코치가 되고나서 수동배포부터 시도를 했지만 Jenkins를 활용한 자동배포는 실패했었다.

Docker에서 Jenkins를 설치하고, Jenkins에서 Docker를 설치했는데 어떠한 문제로 docker not found만 영원히 쳐다보다가 끝난 기억만 있다.

이번에는 Jenkins는 아니지만 GitHub Actions를 활용하여 자동배포를 성공했다.

회사에서 GitHub Actions를 활용해보긴 했지만 이해가 되지는 않았었고, 복붙하는 수준이었지만

이번에는 확실히 어떠한 상황에서 무슨 로직이 포함되어야 하고 이런부분들을 이해할 수 있었다.

 

배포 말고도 GitHub Actions에서 할 수 있는 것들을 많이 시도해봤다.

예를들면 Slack에 알림이 가도록 workflow를 작성했고, pr 요청 시 build check까지 내가 맡아서 진행했다.

조금이라도 Actions에 익숙해지도록 많은 것들을 시도해봤다.

 

목표를 최종발표까지 출시로 잡았지만 달성하진 못했다.

직장 다니면서 진행하는 프로젝트다보니 시간이 부족하다는 것을 느꼈다.

볼륨이 생각했던 것보다 컸고, 기획 단계에서 우선순위를 확실하게 잡았어야했다.

생각보다 오래걸렸고, 다 할 수 있을줄 알고 내버려둔 것이 안일한 판단이었다고 생각한다.

 

마무리

우선 싸피에서는 개발자들끼리 모여서 프로젝트를 했었지만 넥스터즈에는 디자이너분들도 계신다.

이번에 디자이너분들과 함께 프로젝트한게 처음이었는데 템플릿이 있었던것처럼 만들어지는게 너무 신기했다.

그 어려운 캐릭터 디자인을 1시간에 1캐릭터 하신다는 얘기를 듣고 소름이 돋았다.

지금까지 프론트엔드 개발자가 피그마에 작업한것만 봤어서 그런지 '다름' 이라는걸 확실히 알게되었다.

 

그리고 앱 개발도 처음이다.

웹, Unity, 오픈소스 프로젝트 경험이 있지만 배포에 어려움이 없었다.

하지만 앱은 스토어에 등록을 해야하고 심사를 거쳐야한다.

이 과정에서 시간이 꽤 소모되었고, 평소보다 개발을 빠르게 진행해야한다는 것을 깨달았다.

다음 앱 프로젝트를 할때는 이 부분도 고려해서 일정관리 해야겠다는 생각이 들었다.

 

프로젝트 결과는 만족스럽지 못한것 같다.

기간 내에 출시를 못했다는 아쉬움도 있었지만 무엇보다도 설계 단계에서 제대로 짚고넘어가지 못한 부분이 많다는 것을 느꼈다.

QA 과정에서 30개가 넘는 변경사항이 발생했고, 이는 설계나 코드작성 과정에서 실수가 많았다는 것을 나타낸다.

나라는 사람의 현실이 취업한지 1년도 안됐고, 아직 ssafy라는 시스템에 갇혀있는 응애라는 것을 다시 깨닫게 해주었다.

22기 활동 기간에는 내 부족한 점을 파악했다면,

23기 활동 기간에는 부족한 부분 보완하고, 실력을 더 키워서 임해야겠다는 생각이 든다.

 

하지만 이번 활동으로 좋은 팀원들을 만났다.

시작부터 풀악셀로 달렸었던 백엔드, 누구보다 UI에 진심인 야행성 iOS,

묵묵하게 할일 다하는 FM Android, 디자인의 신세계를 보여준 디자이너까지 부족함이 없었다.

정말 다들 새벽 늦게까지 안자고 작업하는 모습들이.. 리스펙한다.

창업 준비하느라 새벽까지 개발하시는 와중에도 프로젝트에 꾸준히 참여하신 분도 계셨다.

어떻게 개발을 하루에 15시간씩 하는거지 아직 믿겨지지 않고, 대단하다고 느꼈다.

나랑 같은 파트를 맡으신 분이라서 내 작업량이 늘어난건 사실이지만 나는 작업을 많이하려고 들어왔기 때문에 오히려 좋았다.

무엇보다 가장 리스펙하는건 아직 학생인데 이런 동아리에 참여해서 프로젝트하는 분들이다.

나는 학생때.. 알고리즘 말고는 할줄아는게 없었고, 사이드 프로젝트를 시도할 생각조차 안했었기 때문이다.

그 외에도 팀원들이 매 미팅, 세션마다 높은 텐션을 보여주었고, 덕분에 내가 금방 적응할 수 있었다.

아무것도 모르는 내 의견 들어주고 받아줘서 감사하고, 닦달 견뎌줘서 너무 감사하다.

 

마지막으로 나에대한 생각인데

분명 처음에는 즐기려고 들어왔지만 어느순간 너무 진지하게 임하는 나를 볼 수 있었다.

업무에 대한 스트레스였는지, 다른 개인적인 것들의 영향인지 모르겠지만 마냥 즐길수만은 없겠다고 생각했다.

아직 주니어 개발자일 뿐이지만 다른 서버 개발자분들의 코드를 보고, 동기부여가 많이 된 것 같다.

내가 진행했던 프로젝트를 리펙토링하면서 얼마나 더해야 조금이라도 따라갈 수 있는 수준이 될까 생각하는 시간을 가져도 괜찮을 것 같다.

23기 활동은 더 보완된 상태에서 개발할 수 있도록 노력해야겠다.

 

Nexters 22기

WWW: 언제 어디서 뭐해

프로미스8팀

모두 고생하셨습니다!!

'잡담' 카테고리의 다른 글

3월 3주차 결산  (0) 2023.03.20
코딩전문역량인증시험(PCCP) 후기  (6) 2023.03.19
3월 2주차 결산  (0) 2023.03.12
3월 1주차 결산  (3) 2023.03.05
2월 4주차 결산  (0) 2023.02.26

알고리즘

1일 1알고리즘

 

후기

회사에서 프론트가 끝나지 않는다..

대신 넥스터즈를 통해 백엔드 경험을 쌓았고, 앞으로도 리펙토링 및 추가개발 진행할 예정이다.

슬슬 다른 일들로 인해 바빠질텐데 다른 공부들도 미리미리 해야할것 같다. 근데 쌓여있는게 너무많네 ^^..

'잡담' 카테고리의 다른 글

코딩전문역량인증시험(PCCP) 후기  (6) 2023.03.19
Nexters 22기 회고  (2) 2023.03.14
3월 1주차 결산  (3) 2023.03.05
2월 4주차 결산  (0) 2023.02.26
2월 3주차 결산  (0) 2023.02.19

알고리즘

1일 1알고리즘

 

넥스터즈 8주차

벌써 마지막주차고, 최종 발표를 진행했다.

앱 출시가 되지않은건 아쉬웠지만 팀원들 모두가 열심히했고, 즐겼으면 됐다고 생각한다.

다들 너무 고생많았습니다!!

후기는 추후 업로드 예정

 

후기

넥스터즈 활동을 해서인지 1, 2월이 너무 녹아버렸다.

정규세션 끝나고 남은 주말을 개발에 올인했었는데 지금 쉬고있으니까 뭔가 어색한 느낌이다.

이번기수 활동이 끝났으니 이제 다른 생산적인 일을 해야겠다는 생각이 든다.

이전에 못했던 cs나 다른 개발지식들을 익혀보려고 한다.

'잡담' 카테고리의 다른 글

Nexters 22기 회고  (2) 2023.03.14
3월 2주차 결산  (0) 2023.03.12
2월 4주차 결산  (0) 2023.02.26
2월 3주차 결산  (0) 2023.02.19
2월 2주차 결산  (0) 2023.02.13

알고리즘

1일 1알고리즘

 

넥스터즈 7주차

이번주는 작업에 집중해야할 시간이다.

원래는 넥나잇으로 밤샘작업의 날이지만 어떠한 이유로 넥나잇 -> 넥버닝으로 변경되어 오전 ~ 저녁 시간에 진행되었다.

이번주에 서버 남은 api작업 및 스케줄링, firebase dynamic link를 위한 간단한 리액트 페이지까지 배포가 완료되었다.

금방 끝날줄 알았는데 생각보다 많은 시간을 소비해서 다른 학습은 하지 못했다.

시간이 너무 빨리 지나갔고, 의미있는 시간이었다.

 

후기

벌써 최종발표까지 한 주 남았다.

걱정되는건 앱 출시가 될지..? 앱 개발자분들이 늦은 시간까지 고생하고 계신다.

빠르게 QA가 진행되면 좋겠지만 생각보다 시간이 오래 걸리는것 같다. 무엇보다 서버에 에러가 없다면 너무 좋겠다.

아무튼 마무리까지 화이팅~

 

'잡담' 카테고리의 다른 글

3월 2주차 결산  (0) 2023.03.12
3월 1주차 결산  (3) 2023.03.05
2월 3주차 결산  (0) 2023.02.19
2월 2주차 결산  (0) 2023.02.13
2월 1주차 결산  (2) 2023.02.05

https://www.acmicpc.net/problem/25682

 

25682번: 체스판 다시 칠하기 2

첫째 줄에 정수 N, M, K가 주어진다. 둘째 줄부터 N개의 줄에는 보드의 각 행의 상태가 주어진다. B는 검은색이며, W는 흰색이다.

www.acmicpc.net

2차원 배열 내 누적합 문제입니다.

2차원 누적합은 (sx, sy) ~ (ex, ey)의 누적합을 말하며, dp[i][j] = cur + dp[i - 1][j] + dp[i][j - 1] - dp[i - 1][j - 1] 공식을 활용해야 합니다.

 

체스판은 검은색, 흰색이 번갈아 칠해져있어야 하고, (1, 1) 지점의 색은 정해지지 않았습니다.

따라서 (1, 1) 지점에 검은색이 올 경우와 흰색이 올 경우를 모두 구해서 최솟값을 구해야 합니다.

이를 위해 dp를 두개 사용합니다.

 

좌표의 x, y값을 더한 값이 홀수인 좌표들끼리와 짝수인 좌표들끼리의 색은 같습니다.

이를 활용하여 해당 좌표에 색이 바껴야하는지에 대해서 각각 누적합을 구할 수 있습니다.

dp를 채웠다면 K * K 크기의 정사각형의 누적합들을 순회하며 최솟값을 구하도록 합니다.

 

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
#include <iostream>
#include <algorithm>
#define MAX 2001
using namespace std;
 
char list[MAX][MAX];
int bdp[MAX][MAX], wdp[MAX][MAX];
int N, M, K;
 
void getPrefixSum() {
    for (int i = 1; i <= N; i++) {
        for (int j = 1; j <= M; j++) {
            bdp[i][j] = bdp[i - 1][j] + bdp[i][j - 1- bdp[i - 1][j - 1];
            wdp[i][j] = wdp[i - 1][j] + wdp[i][j - 1- wdp[i - 1][j - 1];
 
            if (list[i][j] == 'W') {
                if ((i + j) % 2) {
                    wdp[i][j]++;
                }
                else {
                    bdp[i][j]++;
                }
            }
            else {
                if ((i + j) % 2) {
                    bdp[i][j]++;
                }
                else {
                    wdp[i][j]++;
                }
            }
        }
    }
}
 
void func() {
    getPrefixSum();
    int ret = 2147483647;
    for (int i = K; i <= N; i++) {
        for (int j = K; j <= M; j++) {
            ret = min(ret, bdp[i][j] - bdp[i - K][j] - bdp[i][j - K] + bdp[i - K][j - K]);
            ret = min(ret, wdp[i][j] - wdp[i - K][j] - wdp[i][j - K] + wdp[i - K][j - K]);
        }
    }
 
    cout << ret << '\n';
}
 
void input() {
    cin >> N >> M >> K;
    for (int i = 1; i <= N; i++) {
        for (int j = 1; j <= M; j++) {
            cin >> list[i][j];
        }
    }
}
 
int main() {
    cin.tie(NULL); cout.tie(NULL);
    ios::sync_with_stdio(false);
 
    input();
    func();
 
    return 0;
}
cs

'algorithm > dp' 카테고리의 다른 글

boj 12841 정보대 등산  (0) 2023.07.31
boj 25427 DKSH를 찾아라  (0) 2023.05.21
boj 12996 Acka  (0) 2023.01.29
boj 14450 Hoof, Paper, Scissors (Gold)  (0) 2022.12.30
boj 14453 Hoof, Paper, Scissors (Silver)  (0) 2022.12.30

알고리즘

1일 1알고리즘

 

넥스터즈 6주차

벌써 6주차. 이번주는 온라인으로 진행되었다.

22기 활동중이신 개발자분들이 강연을 해주셨고, 처음보는 것들이 있어 신기했지만 공감되는 주제도 있어 나름 집중해서 들었다.

개발은 이번주에 QA 진행중이고, github actions를 이용한 자동배포를 마무리했다.

 

후기

회사에서 진행중인 프로젝트도 어느정도 진행되고는 있지만 마무리가 언제일진 모르겠다.

기획, 개발이 동시에 진행되다보니 뭔가 바뀌는것도 있고 그런 상태다.

동아리에서는 배포쪽 공부를 해보고있는데 역시 어렵다 ㅎㅎ..

같은 백엔드 파트를 맡은 팀원분이 정말 많은것들을 알려주고 계셔서 너무 감사하다.

이번기수 마무리까지도 더 열심히 해야겠다.

'잡담' 카테고리의 다른 글

3월 1주차 결산  (3) 2023.03.05
2월 4주차 결산  (0) 2023.02.26
2월 2주차 결산  (0) 2023.02.13
2월 1주차 결산  (2) 2023.02.05
1월 4주차 결산  (2) 2023.01.30

알고리즘

1일 1알고리즘

 

넥스터즈 5주차

이번주 세션으로 중간발표를 했다.

각 팀의 진행 상황과 이전 주차때 진행했던 UT 피드백을 정리했고, 발표 준비를 위한 회의도 진행했다.

근데 당일에 우리팀 PM님의 개인 사정으로 내가 발표를 하게되었다?? 뭐지

순간 망함을 감지하여 급히 발표자료를 열어보았고, 다른 팀들 발표 시간에 집중을 못하고 멘트 구상을 했다.

긴장을 엄청하긴 했지만 무사히 마무리했다. 어케했는지 기억도 안나는데 팀원들이 잘했다고 하니 다행이다 ㅠ

 

후기

사실 이번주에는 프론트에 치이고 치여서 멘탈이 좀 나갔었다. 지금 프론트를 하는게 맞는건지, 도움은 되고 있는건지 생각이 좀 많았었다.

회사에 프론트 개발자가 없지만 프론트가 95인 프로젝트를 한다라.. 내가 선택하긴 했지만 프론트는 적응이 더 필요한것 같다.

넥스터즈는 벌써 3주밖에 남지 않았다. api 남은 작업들 마무리하면 배포에 시간을 많이 투자할 수 있을 것 같다.

남은 기간도 화이팅~

'잡담' 카테고리의 다른 글

2월 4주차 결산  (0) 2023.02.26
2월 3주차 결산  (0) 2023.02.19
2월 1주차 결산  (2) 2023.02.05
1월 4주차 결산  (2) 2023.01.30
1월 3주차 결산  (0) 2023.01.22

알고리즘

1일 1알고리즘

 

넥스터즈 4주차

이번주 주제는 UT였고, figma, maze를 이용하여 테스트를 진행했다.

사용성 테스트라는걸 처음 해본것 같은데 다른팀 서비스를 간접 체험하고 피드백을 주고받는 나름 의미있는 시간이었다.

이번주는 특히 maze, 설문까지 우리팀 디자이너분들이 너무 고생을 해주셨다.

그런만큼 나도 개발 더 열심히 해야할 것 같고, 받은 피드백들 바탕으로 개선할 점을 찾아야겠다.

 

후기

다음주는 중간 발표 시간이다.

API 개발은 잘 진행되고 있는것 같고, 이후 리팩토링 과정을 거치려고 한다.

이번 프로젝트는 배포를 배우고싶다는 생각이 크기때문에 여기에 많은 시간을 쓰지않을까 생각이 들고, 마무리 잘해야되겠다는 생각이 든다.

회사에서는 프론트엔드, 동아리에서는 백엔드.. 뭐 둘다해서 나쁠건 없지 ㅎㅎ

근데 프론트 너무 어렵다..

'잡담' 카테고리의 다른 글

2월 3주차 결산  (0) 2023.02.19
2월 2주차 결산  (0) 2023.02.13
1월 4주차 결산  (2) 2023.01.30
1월 3주차 결산  (0) 2023.01.22
1월 2주차 결산  (0) 2023.01.16

CloudFront를 통해 퍼블릭 상태의 객체에 대한 접근을 차단하고, https까지 적용시키려고 합니다.

 

https://whyeskang.com/411

 

AWS S3로 React 배포하기

S3와 CloudFront를 이용한 배포 방법이 있고, S3 만으로 배포하는 방법이 있습니다. 권장하는 방법은 S3, CloudFront를 모두 사용하는 방법이고, 이 글에서는 S3 만으로 배포하는 것을 다룹니다. 사전에

whyeskang.com

우선 이전 글에 이어서 포스팅하니, 앞 내용은 여기서 확인해주시면 됩니다.

 

현재 S3만으로 배포가 완료된 이 버킷은 퍼블릭 상태이고, 퍼블릭 차단이 해제되어 있습니다.

먼저 이것부터 돌려놓습니다.

퍼블릭 액세스 차단을 다시 활성화하고, 현재 등록된 버킷정책을 삭제하여 액세스를 "버킷 및 객체가 퍼블릭이 아님" 상태로 돌려놓습니다.

완료된 화면입니다.

 

그리고 정적 웹 사이트 호스팅로 "비활성됨" 으로 변경합니다.

 

https://us-east-1.console.aws.amazon.com/cloudfront/v3/home

 

https://us-east-1.console.aws.amazon.com/cloudfront/v3/home

 

us-east-1.console.aws.amazon.com

그러면 이제 위 링크를 이용하여 CloudFront 페이지로 넘어갑니다.

 

우측의 "배포 생성" 버튼을 누릅니다.

 

우선 원본 도메인으로 해당 버킷에 해당하는 도메인을 선택합니다.

그리고 S3 버킷 액세스를 "원본 액세스 제어 설정"으로 변경합니다.

 

그 다음 제어 설정 생성을 눌러서 해당 S3의 제어 설정을 생성합니다.

건드릴 것 없이 바로 생성 버턴을 누르시면 됩니다.

 

 

그리고 아래에 Origin Shield 활성화를 "예"로 변경합니다.

지역은 S3 버킷과 동일하게 맞춥니다.

 

기본 캐시 동작에서는 하나만 변경하면 됩니다.

뷰어 프로토콜 정책이 HTTP and HTTPS로 되어있을겁니다.

이거를 "Redirect HTTP to HTTPS"로 변경합니다.

 

그리고 맨 밑에 내려와서 기본값 루트 객체를 /index.html 으로 작성하고 배포를 생성합니다.

 

그러면 배포를 생성함과 동시에 S3 버킷 정책을 업데이트하라고 합니다.

정책을 복사해줍니다.

 

그리고 해당 S3로 넘어가서 버킷 -> 권한 -> 버킷 정책 -> 편집에서 해당 내용을 넣고 저장합니다.

위 사진처럼 되면 완료입니다.

 

다시 생성된 배포로 넘어가면 도메인이 표시되어 있습니다.

 

도메인 + /index.html 으로 들어가면 배포가 완료되었고, https까지 적용된 것을 확인하실 수 있습니다.

그리고 버킷의 엔드포인트까지 노출되지 않아서 S3만으로 배포한 방법보다는 안정적이라고 볼 수 있습니다.

 

하지만 도메인/index.html 을 통해서만 이 페이지가 뜨며, /index.html를 제거한다면 AccessDenied가 뜹니다.

여기서 오류페이지에 대한 응답을 직접 생성하는 방법으로 해결합니다.

 

해당 배포 -> 오류 페이지 응답 생성에서 사용자 정의 오류 응답 생성 버튼을 누릅니다.

 

여기서 오류코드를 응답 페이지로 이동하도록 지정할 수 있습니다.

/index.html로 경로를 설정하고, 응답 코드를 200으로 변경합니다.

 

같은 방법으로 403, 404에 대한 응답 페이지를 생성하였습니다.

 

이제 /index.html 없이 도메인 입력만으로 이동이 가능한 것을 확인할 수 있습니다.

'Etc' 카테고리의 다른 글

AWS S3로 React 배포하기  (0) 2023.02.02
GitHub Actions를 이용한 Slack Notification  (0) 2023.01.30
GitLab -> GitHub Mirroring  (0) 2022.06.12
Unity Script로 카메라 Culling Mask 기능 사용하기  (2) 2021.10.29
Unity 카메라 Culling Mask  (0) 2021.10.29

S3와 CloudFront를 이용한 배포 방법이 있고, S3 만으로 배포하는 방법이 있습니다.

권장하는 방법은 S3, CloudFront를 모두 사용하는 방법이고, 이 글에서는 S3 만으로 배포하는 것을 다룹니다.

 

사전에 준비하셔야할 것은 배포 하려고하는 React 프로젝트입니다.

npx create-react-app deploy-app

저는 기본 프로젝트를 배포하기 위해 위 명령어로 새 프로젝트를 만들었습니다.

 

우선 프로젝트를 S3에 업로드한 후에 배포를 진행하게 됩니다.

먼저 리액트 프로젝트를 아래 명령어로 빌드해주시면 됩니다.

npm run build

그럼 프로젝트 바로밑에 build 폴더가 생성되는 것을 확인할 수 있습니다.

build 폴더 아래의 모든 파일을 S3에 업로드합니다.

 

https://s3.console.aws.amazon.com/s3/buckets

 

https://s3.console.aws.amazon.com/s3/buckets

 

s3.console.aws.amazon.com

위 링크를 이용하여 S3 버킷 페이지로 이동합니다.

그리고 우측에 "버킷 만들기" 버튼으로 버킷을 생성합니다.

 

버킷 이름은 원하는대로 작성합니다.

 

객체 소유권은 비활성화됨을 유지합니다.

 

원래는 모든 퍼블릭 액세스를 차단하는 것이 맞습니다.

하지만 S3만으로 배포할 때는 차단을 해제합니다.

이는 추후에 업로드할 CloudFront로 보완할 수 있습니다.

 

나머지 설정은 기본으로 놔두고 버킷을 생성하시면 됩니다.

이렇게 생성된 버킷의 액세스는 "객체를 퍼블릭으로 설정할 수 있음" 상태입니다.

이것을 "퍼플릭" 상태로 변경해야 합니다.

이를 위해 버킷 -> 권한 -> 버킷 정책에서 "편집" 버튼을 눌러 버킷 정책을 넣어주시면 됩니다.

 

1시 방향의 "정책 생성기" 버튼으로 편하게 정책을 생성할 수 있습니다.

그 전에 왼쪽의 버킷 ARN을 복사하고 넘어가도록 합시다.

 

먼저 Policy Type은 "S3 Bucket Policy"를 선택합니다.

Principal은 *

Actions는 GetObject

ARN은 방금 복사했던 ARN + /*을 넣습니다. (/*을 반드시 포함해야 합니다.)

그러면 Add Statement 버튼이 활성화되며, 클릭합니다.

 

Generate Policy 버튼까지 누르면 JSON 형식으로 버킷 정책이 생성됩니다.

위 내용을 복사합니다.

 

그리고 다시 버킷 정책으로 돌아와서 복사한 내용을 붙여 넣으면 됩니다.

그리고 "변경 사항 저장" 버튼을 눌러 저장합니다.

 

그러면 객체의 액세스가 퍼블릭으로 변경된 것을 확인할 수 있습니다.

 

다시 해당 버킷으로 들어갑니다.

여기에 아까 build했던 파일을 다 업로드합니다.

업로드가 완료되면 이런 상태가 됩니다.

 

그리고 속성에서 맨 밑으로 내려가면 "정적 웹 사이트 호스팅"이 있습니다. 편집을 누릅니다.

우선 활성화부터 해주시고, 기본 페이지로 index.html 을 넣어줍니다.

그리고 변경사항을 저장합니다.

 

그러면 이렇게 URL을 발급 받을 수 있습니다.

 

그리고 해당 URL을 클릭하면 배포가 완료된 것을 확인할 수 있습니다.

 

다만 이 방법은 객체가 퍼블릭 상태고, https가 적용되지 않아 보안상의 이슈가 있습니다.

이를 해결하기 위해서는 CloudFront에 S3를 연결해주는 작업이 필요합니다.

CloudFront 관련 글은 아래 링크에서 확인해주시면 되겠습니다.

https://whyeskang.com/412

 

 

GitHub Actions를 이용하기 전에 Github & Slack부터 진행하며, Slack 워크스페이스가 만들어져 있다는 가정하에 시작합니다.

 

우선 알림을 받으려고 하는 채널을 생성합니다.

 

그리고 아래에 있는 "앱 추가" 버튼을 누릅니다.

 

"GitHub"를 추가합니다.

 

그 다음은 채널 우클릭 -> 채널 세부정보 보기 -> 통합 -> 앱 에서 앱 추가를 합니다.

GitHub를 추가하시면 됩니다.

그러면 해당 채널에서 위 메시지를 확인할 수 있습니다.

 

/github signin 명령어를 치면 GitHub에 연결할 수 있도록 메시지가 전송됩니다.

버튼을 눌러서 연결할 수 있고, Verification Code를 받으면 위 사진에 있는 Enter code에 입력하면 연동되는 것을 확인할 수 있습니다.

 

이제 계정과 연결을 했으니 GitHub Repository에 연결하도록 합니다.

명령어는 /github subscribe owner/repository 입니다.

여기 드래그된 부분을 owner/repository 자리에 넣어주시면 되겠습니다.

 

이 메시지를 받으셨다면 연결은 완료되었습니다.

 

이제 GitActions와 연동을 하겠습니다.

https://api.slack.com/apps

 

Slack API: Applications | Slack

Your Apps Don't see an app you're looking for? Sign in to another workspace.

api.slack.com

먼저 위 링크를 타고 가서 Create New App 버튼으로 앱을 생성합니다.

 

그리고 Settings -> Basic Information -> Add features and functionality에서 Incoming Webhooks를 누르고 활성화합니다.

 

그 다음 아래에서 Add New Webhook to Workspace 버튼으로 워크스페이스와 채널에 연결합니다.

그러면 이렇게 Webhook URL을 받을 수 있습니다. 이거를 GitHub의 secrets에 넣어줍니다.

 

GitHub -> Settings -> Security -> Secrets and variables -> Actions에 들어가셔서 New repository secret 버튼으로 발급 받은 Webhook URL을 넣어줍니다.

이렇게 등록되어야 합니다.

 

이제 yml 파일을 .github/workflows 경로 내에 작성해야 합니다.

Actions 페이지로 와서 "set up a workflow yourself"를 클릭합니다.

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
name: Slack Notification
 
on:
  pull_request:
    branches: [ "master""develop" ]
 
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
    - name: action-slack
      uses: 8398a7/action-slack@v3
      with:
        status: ${{ job.status }}
        author_name: www-be
        fields: repo,message,commit,author,action,eventName,ref,workflow,job,took
        if_mention: failure,cancelled
      env:
        SLACK_WEBHOOK_URL: ${{ secrets.SLACK_WEBHOOK_URL }} # required
      if: always() # Pick up events even if the job fails or is canceled.
 
cs

먼저 name으로 workflow의 이름을 작성합니다.

 

on은 workflow가 실행될 조건을 명시합니다.

보통 push나 pull request를 등록하며, 저는 pull request만 작성했습니다.

 

jobs에는 실행되는 명령어들을 작성합니다.

여기서 secrets에 등록한 SLACK_WEBHOOK_URL을 사용합니다.

그 외 파라미터나 필드 등 설명은 https://action-slack.netlify.app/ 여기서 확인해주시거나 아래 레퍼런스에서 확인해주시면 되겠습니다.

 

등록이 완료되었다면 이렇게 알림을 받아보실 수 있습니다.

 

Reference

GitHub & Slack 연동

Git Actions 활용

'Etc' 카테고리의 다른 글

AWS S3 & CloudFront로 React 배포하기  (0) 2023.02.02
AWS S3로 React 배포하기  (0) 2023.02.02
GitLab -> GitHub Mirroring  (0) 2022.06.12
Unity Script로 카메라 Culling Mask 기능 사용하기  (2) 2021.10.29
Unity 카메라 Culling Mask  (0) 2021.10.29

알고리즘

1일 1알고리즘

 

넥스터즈 3주차

저번주 설 연휴가 있어서 오랜만에 정규활동을 진행했다.

이번주 활동으로는 팀 회의와 레크레이션이 진행되었다.

레크레이션은 퀴즈 위주로 진행되었고, 팀원 한분이 하드캐리를 하는 바람에.. 너무 재미있었다 ㅎㅎ

 

후기

개발을 계속 하고있지만 중간에 애매한 부분이 많아 물어보고, 회의 일정 잡고 하는 시간이 늘어난 것 같다.

화면 설계를 보면서 api 정리를 다시 해야할 것 같다.

벌써 1월이 끝나려고 하는데, 정말 열심히 하자는 생각을 갖고 올해가 시작되었고, 현재는 잘 지켜진것 같아 만족스럽다.

근데 점점 워커홀릭이 되어가는 느낌이다. 개발이 점점 재밌어지는데 긍정적인게 맞겠지?

'잡담' 카테고리의 다른 글

2월 2주차 결산  (0) 2023.02.13
2월 1주차 결산  (2) 2023.02.05
1월 3주차 결산  (0) 2023.01.22
1월 2주차 결산  (0) 2023.01.16
1월 1주차 결산  (0) 2023.01.09

+ Recent posts