✅ 스터디 목적 : ❗️프론트 엔드 단 구체적 지식 습득부터, 실제 프로덕트 개발 - 테스트 - 배포 과정을 모두 스터디를 통해 한번씩 밟아보기❗️

실제로 광고도 달아보고 사용자도 받아보자!

✅ 스터디를 만든 이유 : 요즘 취업 시장에서 ❗️실무에서 쓰이는 능력❗️들을 많이 필요로 하는 것 같아요..

그러나 혼자서는 이런 능력을 모두 습득하기엔 한계가 있다고 생각합니다.

그리고 ❗️협업 능력❗️도 많이 필요하죠!

그래서 ❗️스터디를 통해 구체적 지식을 공부하고 협업을 하며 프로덕트(웹서비스) 출시의 모든 단계를 한번씩 밟아보고자 ❗️합니다!

✅ 스터디 과정 :

1️⃣ 자바스크립트 - 리액트(상태관리기술 - zustand 등 포함) - 타입스크립트 - Next.js 스터디

2️⃣ 프로덕트 아이디에이션

→ 인원에 따라 팀을 짜거나 / 전체 인원이 아이디어를 제시하고 그 중 하나의 아이디어를 구현해봅시다!

→ 아이디어는 단순히 게시판 만들기나 블로그가 만들기를 넘어 사용자에게 필요한 구체적인 웹서비스를 구현하는 것이어야 합니다! 제 생각엔 서울대학교 학생분들을 위한 웹서비스를 만들기 같은 게 좋을 것 같습니다!

예를 들어 ‘식샤’ 앱 처럼..

3️⃣ 실제 협업을 통한 개발

프론트엔드 개발 → 자바스크립트 및 타입스크립트 & 리액트/Next.js

벡엔드 개발 → Next.js 및 파이어베이스

4️⃣ 코드 테스트 시도(CI/CD, 유닛테스트 / Jest, Mocha 등 프레임워크 공부)

5️⃣ aws를 통해 배포

✅ 스터디 과정 설명 :

• 1️⃣ - 현재 프론트엔드 개발자들의 필수적으로 필요한 지식을 쌓고자 합니다. 자바스크립트는 물론이고, 리액트와 타입스크립트는 요새 자격요건에 거의 필수 사항이더라구요.. 그리고 Next.js가 대세로 떠오르면서(벡엔드 개발이 어느정도 가능하기도 함) Next.js를 공부하는 것이 트렌드가 되고 있다고 생각하고, CSR이 아닌 SSR로 개발하는 것이 여러 이점이 있습니다. (현재 SSR 열풍이 불고 있습니다~! 아래 링크 참고) 참고 👇 (제로초님의 프론트엔드 로드맵 https://www.zerocho.com/lecture) (프론트엔드 로드맵 정리 https://velog.io/@acd0825/Front-end-로드맵-정리-목표-설정-해보기) (next.js? https://blog.naver.com/so_no7/223403414143)
• 2️⃣3️⃣ - 웹 서비스 개발 및 출시부터 운영까지! 실제 사용자가 사용해본 프로덕트를 만들어본 경험이 있는 사람들을 많이 우대하는 것 같습니다!
• 4️⃣ - 개발 공부할 때(취준 할 때)는 생각을 잘 못하지만 실제 업무에서는 테스트 코드를 짜는 것이 굉장히 중요하다고 합니다. 우리가 정확히 할 수 있을진 모르겠지만 아예 안하고 가는 것보단 낫겠지요! 참고 👉 (테스트코드를 왜 그리고 어떻게 작성해야 할까? https://tech.inflab.com/20230404-test-code/) (요즘 IT - 테스트 코드는 왜 만들까? https://yozm.wishket.com/magazine/detail/1964/)

5️⃣ - 요즘 대부분 it 회사는 aws로 많이 배포하고 있는 것 같습니다!

🔥 하지만 더욱 왜 이 스터디가 필요한지 알기 위해선 채용공고를 직접 살펴보는 것이 유용하겠죠!

제가 채용 플랫폼에 👉프론트엔드 개발자 👈검색을 했을 때 나오는

• ❗️자격요건 및 우대사항❗️을 간단히 정리해보았습니다! 🔥
  • 네카라쿠배당토 프론트엔드 채용 공고 정리 링크
  • 인프랩

    주요업무

    • VanillaJS (ES6), TypeScript, React, Next.js 를 기반으로 인프랩의 여러 서비스의 웹 프론트를 개발하고 배포합니다.
    • TypeScript 기반의 정적 타입 개발을 하여 안정적인 서비스 개발을 진행합니다.
    • Server Rendering과 Client Rendering을 상황에 맞게 적절히 선택하고 이들을 위한 마크업을 개발합니다.
    • 시스템 전반의 성능 최적화를 위해 API 호출 최소화 / 렌더링 최적화 / 번들링 최적화 등을 상시로 진행합니다.
    • 사용자를 위한 UI/UX 개선을 고민하고 적용합니다.
    • 온라인 PR, 오프라인 페어프로그래밍 등 코드리뷰를 통해 성장하는 문화를 지향하고 있습니다.
    • 모니터링 서비스인 Datadog을 적극적으로 사용하여 시스템에서 발생하는 모든 이슈 사항에 대해서 추적하고 해결합니다.

    자격요건

    • JavaScript 에 대한 이해가 있으신 분
    • 정적 타입 언어를 사용했거나, TypeScript에 대한 이해가 있으신 분
    • HTML, CSS 등 마크업에 대한 충분한 이해도가 있으신 분
    • React, Vue, Angular 등 프론트엔드 라이브러리 또는 프레임워크에 대한 이해가 있으신 분
    • SSR, CSR에 대한 기본적인 이해가 있으신 분
    • HTTP 통신에 대한 기본적인 이해, RESTful API에 대한 설계나 개발 경험이 있으신 분
    • Function, Class, Instance, Object Literal 에 대해 기본적인 내용을 알고 있고, 상황에 따라 적절하게 사용하고 계신 분
    • 반응형 웹 개발에 대한 이해가 있으신분
    • Git과 Github에 대한 기본적인 사용법을 알고 있고, Git Flow를 이해하고 계신 분

    우대사항

    • Vanilla JavaScript를 통해 웹 페이지를 만들어본 경험이 있으신 분
    • TypeScript 등 강타입 (Strongly Typed) 언어를 이해하고 있으신 분
    • 함수형 프로그래밍을 이해하고 실제 작업에서 활용하고 계신 분
    • 웹표준 또는 웹접근성 등 퍼블리싱과 관련된 이해 또는 경험이 있으신 분
    • Webpack이나 Rollup 같은 번들러를 직접 구성하거나 사용하면서 생긴 문제를 해결해본 경험이 있으신 분
    • 브라우저 별 다양한 트러블 슈팅 경험이 있으신 분
    • React Native, Web View 환경에서 트러블 슈팅 경험이 있으신 분
    • Jest, Mocha 등 테스트 프레임워크를 통해 단위 테스트 코드를 작성해오신 분
    • UI 테스트에 대한 경험이 있으신 분
    • 인프라 엔지니어가 없으면, 본인이 직접 AWS 인프라 구성을 해서라도 문제를 해결해야 속이 시원하신 분
    • 반복적으로 진행하는 수동적인 작업에 불편을 느껴 자동화를 진행해본 경험이 있으신 분
    • 본인이 만든 애플리케이션을 실제 서비스, 운영까지 해보신 분
    • 웹 서비스 성능 개선을 진행해본 경험 혹은 노하우가 있으신 분
    • 모니터링/로그/알람을 통해 장애를 탐지하고 해결해본 경험이 있으신 분
    • 동일 장애 재발 방지를 위해 시스템/프로세스 개선을 해보신 분
    • 서버 개발자, 디자이너와 협업한 경험이 있으며, 서버 업무, 디자인 업무에 대한 최소한의 이해도가 있으신 분
    • (주니어분들이라면) 위 언급되어있는 개념들을 몰라도 빠르게 내 것으로 만들수 있는 나만의 학습법을 가지고 계신 분
    • (경력무관) 운영/기획파트 등 개발자가 아닌 분들께 상황을 설명할 때 그들의 입장에서/그들의 언어로 이야기하는게 당연하신 분
    • (경력무관) 대화보다 하나의 문서를 작성하고 공유하길 좋아하시는 분
  • 넛지헬스케어

    업무내용

    • Next.js 를 이용한 웹 애플리케이션 개발
    • 상용 서비스 사용자 단 프론트엔드 개발 및 운영
    • Back Office 프론트엔드 개발 및 운영
    • AWS 서버 배포 자동화 및 관리
    • 24시간 365일 유저에게 원활한 서비스 경험 제공

    지원자격

    • 정규직 전환 후 계속 근무가 가능하신 분 (졸업자 or 졸업예정자)

    우대사항

    [실무경험]
    • React query, Zustand, Recoil 등의 상태 관리 기술 사용 경험을 보유하신 분
    • REST API, GraphQL 등 다양한 인터페이스 사용 경험이 있으신 분
    • Functional programming, OOP 등의 주요 프로그래밍 패러다임에 대한 이해가 있으신 분
    • 유닛 테스트와 CI 경험이 있으신 분 [서비스운영의 전문가가 되고자 하시는 분]
    • 서비스를 만드는 일을 좋아하시는 분
    • 취미로 개발하는 소프트웨어 프로젝트가 있는 경우 우대
    • 사용자가 개발한 서비스를 항상 원활하게 이용할 수 있도록 높은 책임감을 가지고 운영하시는 분
  • 젠다카디언

    자격요건

    • 경력 최소 5년 이상
    • 학사(4년제) 이상
    • 전자,컴퓨터 계열 전공
    • 나이, 성별 무관
    • 필수 역량
    • Language: Javascript, Typescript, Nodejs
    • Frontend: Next.js (React.js base)
    • Cloud Service: Firebase, AWS or GCP
    • Git, GitHub

    우대사항

    • 공학계열 (컴퓨터/시스템 공학)를 전공하신 분
    • Vercel 사용 경험이 있으신 분
    • Backend에 대한 경험이 있으신 분
    • Jira에 대한 경험이 있으신 분
    • 다량의 차트 및 분석 결과를 제공하는 Dashboard 개발 경험이 있으신 분
    • 영어가능자
  • 렉스퍼

    자격요건

    • React.js 개발 경력 2년 이상 혹은 이에 준하는 프로젝트 개발 경험을 보유하신 분
    • Redux 등 상태 관리 라이브러리를 사용한 경험이 있으신 분
    • 반응형 웹 디자인으로 UI 개발을 해보신 분
    • 웹(브라우저) 성능 최적화에 대한 이해와 경험이 있는 분
    • 일반적인 웹 프론트엔드 기술(ES6, HTML, CSS, HTTP, REST API 등)을 이해하고 적용할 수 있는 분
    • 분산 버전 관리 시스템(Git) 이용에 능숙한 분 [기술스택]
    • javascript, Typescript, ReactJS, NextJS
    • Redux, Redux-toolkit, Redux-saga
    • Styled-component, MaterialUI

    우대사항

    • 신규 서비스 또는 플랫폼을 개발 및 런칭하고 성장시켜보신 경험
    • 스타트업 또는 빠르게 성장하는 조직에서의 협업 경험
    • Typescript, NextJS 사용 경험
    • Jira 및 Confluence 사용 경험
    • 빌드 및 배포 자동화, 테스팅 자동화 등 CI/CD 활용 경험
    • 사용자 경험을 중점으로 UI를 기획해본 경험
  • 티엔에이치 자격요건
    • 리액트 개발 경험 최소 3년 이상 (필수)
    • CS 기본 지식
    • CI/CD, 유닛테스트 사용 경험 (GitAction, Jest)
    • Redux, Recoil을 활용하여 개발한 경험 우대사항
    • MSA 환경 설계 경험이 있으신 분
    • 프로젝트 설계부터 서비스까지 경험이 있으신 분
    • 신기술에 관심이 있으시고 프론트 엔드 개발을 이끌어 주실 자질을 갖추신 분
  • 팹 자격요건
    • React Native, React.js, Next.js 등의 프론트엔드 개발 경험 최소 5년 이상
    • 상태 관리에 대한 높은 이해도 필수
    • 사용 최적화의 높은 이해도 필수
    • Typescript를 이용한 개발 경험
    • Github, Jira 등 협업 도구 사용에 어려움이 없으신 분 우대사항
    • 여러 상태 관리 케이스를 경험
    • RN 배포를 처음부터 끝까지 관장했었던 경험
    • 자신만의 RN 성능 개선 노하우를 갖은 경험
    • 아래 외부 툴 활용 경험이 있으신 분
    • Sentry
    • Amplitude
    • Google analytics
    • Braze
    • Appsflyer
    • 3명 이상 규모의 개발팀을 운영 혹은 빌드에 참여한 경험이 있으신 분
  • 올거나이즈코리아 자격요건
    • 5년 이상의 client-side Javascript Application 을 개발하신 경력이 있으신 분
    • HTML / CSS / Javascript 에 대한 이해가 높으신 분
    • 웹 애플리케이션의 성능 최적화에 관련한 지식과 경험을 보유하신 분
    • Cross Browser 호환성에 대한 지식과 경험을 보유하신 분
    • UI/UX 에 대한 이해가 있으신 분
    • 본인의 코드가 고객에게 어떤 영향을 미치는지 고객 관점에서 이해하고 설명할 수 있으신 분 우대사항
    • 영어 / 일본어 가능하신 분 우대합니다.
    • Open Source Project 경험이 있으신 분 우대합니다.
  • 발란
    • 5년 이상 프론트엔드 서비스를 구축하고 운영한 경험이 있으신 분
    • Javascript(Typescript) 기반으로 서비스 구축 경험이 있으신 분
    • React, Vue.js 중 하나 이상의 SPA 프레임워크 활용이 가능하신 분
    • SSR 프레임워크(Next.js, Nuxt.js)를 활용한 서비스 구축 & 운영 경험이 있으신 분
    • HTML, CSS, Javascript의 이해가 깊으신 분
    • 웹 포트폴리오 제출 (프로젝트별 역할 및 참여율 필수 기재) [기술스택]
    • 발란몰
    • 프론트 : plain css&jquery, ejs
    • 백엔드 : Node.js 14, MongoDB, Redis, MariaDB, AWS S3
    • 백오피스 : Node.js 14, Vue.js, Bootstrap-Vue, Nuxt.js, MongoDB, Redis, MariaDB, AWS S3
    • 검색엔진 : Elasticsearch
    • 분석 : Google Analytics
    • 코드관리 : Github, BitBucket
    • IDE : WebStorm, PHPStorm, Intellij IDEA, PyCharm
    • Tools: NoSQL Booster, Heidisql, Xshell, WinMerge, Medis, Postman
    • 커뮤니케이션 : Slack, Notion, Confluence, Jira, 서비스데스크
    • 모니터링 : CloudWatch, Opsnow, 자체 모니터링 툴
  • 자이온아이티에스 자격요건 [이런 기술을 사용할 예정이에요]
    • React/Next.js, TypeScript, ES6+
    • Emotion, React-query, redux, Storybook, Jest ※ 본인이 도입하기 원하는 기술 스택이 있다면 협의 가능 [이런 분을 찾고 있어요]
    • 4년 이상의 React.js/Next.js 등 모던 FE 프레임워크를 활용한 개발 경험
    • 최적화, 테스팅 등의 성능 개선 지식 및 경험이 있으신 분
    • Redux, jotai, mobx 와 같은 상태 관리 개발 경험이 풍부하신 분 [이런 분이면 좋아요]
    • 제품 개발 초기부터 제품이 고객에게 전달되기까지의 경험이 있으신 분
    • 최신 기술에 관심이 있고, 최적화에 관심을 두시는 분
    • 팀원들과의 커뮤니케이션에 적극적이신 분 우대사항
    • yarn, yarn workspace monoRepo, Next 13 / React 18 버전 이상 경험이 있으신 분
    • 디자인 시스템에 기반한 공통 컴포넌트성 개발 경험이 있으신 분
    • 단위 테스트, E2E 테스트 등 테스트 코드 작성 경험이 있으신 분
    • RESTful API/GraphQL 등에 대한 관심과 이해가 높으신 분
    • 테스트, 배포 등 개발 프로세스에 대한 자동화 경험이 있으신 분
    • 웹사이트 성능 측정 및 최적화 경험이 있으신 분
    • 마이크로 프론트 엔드에 대한 관심, 경험이 있으신 분
    • on-premise 환경 배포 경험이 있으신분
    • commonJS, ESM 등 Javascript 모듈에 대한 이해가 있으신분

✅ 참고 일단 목표는 ❗️프론트엔드 지식 습득 및 최소 1-2개 이상 프로덕트 만들고 배포해서 운영하기 입니다! ❗️