Lennon FE

안녕하세요. 👋🏻 구름에서 풀스택 개발을 하고 있는 Kenny입니다 :) 이번 포스팅에선 프론트엔드 개발자로서 자발적으로 사용성 개선을 위해 개발한 경험에 대해 회고해보려 합니다. 제가 개발한 기능은 구름 LEVEL(이하 레벨) 서비스에서 QnA를 작성할 때 누를 수 있는 내 코드 불러오기를 활용할 수 있는 버튼인데요. 위 기능은 꾸준히 제품을 개발해 오며, 언젠가는 꼭 개선하겠다는 다짐을 토대로 시작되었습니다. 누구의 기획도 없이(물론 팀들은 알고 있었습니다) 온전히 남는 시간에 틈틈히 사용성 개선을 위해 개발한 거라 더욱더 애정이 있는 것 같네요. 😎 왜 개발 했나요? 제가 위 기능을 꼭 개선해야겠다고 다짐한 건 아래의 이유 때문이었습니다. 1. QnA를 작성하는 에디터에 코드 버튼이 있고, plac..

[내가 만든 프로젝트 참여하기 프로젝트] 6. 문자열 나누기 const readline = require('readline'); const rl = readline.createInterface({ input: process.stdin, output: process.stdout, }); const input = []; rl.on('line', (line) => { input.push(line); if (input.length === 2) { rl.close(); } }); rl.on('close', () => { const [N, S] = input; const { divideArr, sortedDivideStrArr } = divideStringIntoThreeParts(N, S); const answe..

[개발한 프로젝트 참여하기 프로젝트] 1. 운동 중독 플레이어 const readline = require('readline'); let rl = readline.createInterface({ input: process.stdin, output: process.stdout, }); let input; rl.on('line', (line) => { input = line; rl.close(); }); rl.on('close', () => { const [W, R] = input.split(" ").map(Number); const answer = getOneRM({W, R}); console.log(answer); }) const getOneRM = ({W, R}) => { const OneRM = Ma..

안녕하세요 :) 저는 구름에 1년 정도 재직 중인 Kenny입니다. 근 한 달 정도 사내에서 구름톤 챌린지 프로젝트에 대한 개발을 혼자 진행했는데, 관련해서 회고를 하려고 합니다. 먼저 구름톤 챌린지는 아래 랜딩 페이지 링크에 들어가시면 어떤 서비스인지 쉽게 아실 것 같아요. 구름톤 챌린지 랜딩 페이지 링크 (14일 날 정식 오픈이고, 저는 열심히 사용자들을 위해 남은 Ui 개발 및 검수를 진행하고 있습니다.) 📚 회고 시작 혼자 프로젝트를 진행한다는 것 저는 풀스택 엔지니어로 입사했지만 다들 백엔드 성향이 강해 프론트엔드를 주로 작업했었는데요, 이번엔 새로운 사업들이 생겨나고 같은 팀 사람들이 tf로 빠지면서 인원이 부족한 상태라 백엔드까지 혼자 진행하게 됐습니다. 혼자 프로젝트를 진행한다는 건 상당히..

Next13의 app router 방식에서 현재 Emotion을 공식적으로 지원해주지 않는다.🥲 그렇지만 Project에서 Emotion lib를 사용하고, css속성을 사용하고, app router의 RSC를 사용하고 싶은 사람들이 있을까 봐(본인 포함!) 방법을 알려주려한다. 다들 알다시피 Emotion에 css 속성을 사용하려면 tsconfig.json에 "jsxImportSource": "@emotion/react", 위와 같은 속성을 넣어야 한다. 그러면 모든 태그에 css를 넣을 수 있어 아래처럼 작성할 수 있게 된다. import { css } from '@emotion/react'; 그렇지만 tsconfig에 "jsxImportSource": "@emotion/react", 위 속성을 가진..

2023 SW 중심대학 공동 해커톤 링크 먼저 2023 SW중심대학 공동 해커톤은 위와 같은 프로그램이다. 전국에 SW 중심대학 51개 대학에서 학교를 대표하는 개발자 4명 디자이너 1명씩 와서 팀을 꾸리고 2박 3일 해커톤을 하는 프로그램이다.멘토 섭외 과정1. 링크드인 및 개인 회사 메일로 초청 2. 프로필 첨부 3. 합격 의 과정으로 섭외가 되는 것 같다. 나는 5월 초에 링크드인으로 해커톤 멘토 초청 문의가 왔다. 아마 예상하기로 성격이 비슷한 ☁️구름톤☁️에서 멘토 경험이 있고, 타 관련 프로그램도 이수한 경험 때문에 연락이 온 것 같다. 멘토 섭외 관련해 프로필을 요청주셔셔 프로필을 제작하고 보낸 뒤 2주 정도 뒤 합격 메일이 돌아왔다. 프로필에는 이전 멘토 관련 경험을 주로 상세히 작성했으며..

Next.js를 포함한 React 프로젝트에서 Cypress로 e2e를 구현해 봅시다. 프로젝트에 Cypress를 설치해 줍니다. $ yarn add cypress --dev or $ npm install cypress --save-dev Package.json에 가서 스크립트를 추가해 줍니다. "scripts": { ..., "test": "cypress open", "cy:run": "cypress run" }, 터미널에서 명령어를 작성해 봅시다 $ yarn test or $ npm run test 그럼 아래와 같은 프로그램이 켜질 겁니다! 우리는 e2e를 구현할 것이니까 첫 번째를 선택하고 파일을 생성해 준다는 거에 동의하고 넘어갑니다. 제 기준 Electron이 편해서 선택하여 Start를 누릅니..