본문 바로가기

분류 전체보기

 (1092)
[프로그래머스] 문자열 내 p와 y의 개수 - JavaScript 풀이 본 게시물은 프로그래머스의 연습 문제 풀이입니다. 저작권은 (주) 그랩에게 있습니다 자바스크립트 코드(나의 풀이) function solution(s){ // p의 갯수 let pEA = 0; // y의 갯수 let yEA = 0; // 문자열 -> 배열 -> forEach로 순회 s.split('').forEach((string) => { const convertedString = string.toLowerCase(); if (convertedString === 'p') pEA += 1; if (convertedString === 'y') yEA += 1; }) return pEA === yEA; } Reference 프로그래머스
WIL(22.07.10) 내가 배운것 프로그래머스 문제 풀이 Nomad Coders - React JS 마스터클래스 수강 차주에 진행할 것 프로그래머스 문제 풀이 Nomad Coders - React JS 마스터클래스 완강 앞으로 진행할 것 Git 공부 팀 개발을 위한 Git, GitHub 시작하기 React 벨로퍼트와 함께하는 모던 리액트 Hook Redux TypeScript OPP Design Pattern Test 시각적 회귀 Refactoring(마틴 파울로) 2판 읽기 외출난이도 리팩터링
[프로그래머스] 문자열 내림차순으로 배치하기 - JavaScript 풀이 본 게시물은 프로그래머스의 연습 문제 풀이입니다. 저작권은 (주) 그랩에게 있습니다 자바스크립트 코드(나의 풀이) function solution(s) { return s.split('').sort().reverse().join(''); } Reference 프로그래머스
Styled Components(3) 본 내용은 Nomad Coders - React JS 마스터클래스 강의를 토대로 작성하였습니다. Themes 모든 색상을 가지고 있는 object 프로젝트에 일관성 있는 스타일을 정의할 수 있음 라이트모드/다크모드를 도입할 수 있음 Themes 주입 가장 상위의 컴포넌트에서 테마를 주입하기 styled-components의 ThemeProvider를 import import React from 'react'; import ReactDOM from 'react-dom/client'; import App from './App'; import { ThemeProvider } from 'styled-components'; ​ // 색상을 가지고 있는 object const theme = { textColor: ..
Styled Components(2) 본 내용은 Nomad Coders - React JS 마스터클래스 강의를 토대로 작성하였습니다. 1. as 명시된 HTML 요소 말고 다른 HTML 요소를 사용하는 기능 import styled from 'styled-components'; ​ ​ const Text = styled.text` color: white; `; ​ ​ function App() { // Text 컴포넌트는 text 요소로 지정되어있어도 as를 사용하여 h1 태그로 사용 가능 return 헤더입니다. } ​ export default App; 2. Attrs HTML Attributes에 접근 가능 import styled from 'styled-components'; ​ ​ const Btn = styled.button.at..
Styled Components(1) - 개요, 스타일링 방법, 동적 스타일링, 컴포넌트 확장 본 내용은 Nomad Coders - React JS 마스터클래스 강의를 토대로 작성하였습니다. 1. Styled Components React.js에서 최적화된 스타일링 제공 CSS를 살펴보지 않고도 각각의 컴포넌트가 맡은 일을 파악할 수 있음 컴포넌트에 사용되는 각 요소에대해서 역할에 따른 이름을 붙여줄 수 있어, 코드 파악에 용이 Styled Components가 해당 요소에 독자적인 class명을 붙여줌 컴포넌트의 확장 기존의 컴포넌트 스타일을 확장할 수 있음 동적 스타일링 props를 활용하여 컴포넌트 스타일링할 수 있음 2. 스타일링 방법 import styled from 'styled-components'; ​ ​ const Header = styled.h1` color: white; `; ..
iOS Button Text Color 1. Button Text Color 이슈 2021년 9월 어느날, 서비스 중인 앱 내 버튼 컬러들이 blue로 바뀌어버린 이슈가 인입되었다. 일관적인 UI를 제공하기 위해 해당 이슈는 해결되어야했고 내가 그것을 맡게되었었다. 2. 상황 재현 다행히도, 상황을 재현하는 것은 어렵지 않았다. iOS에서만 해당 상황이 재현되었던 것이다. 그것도 최근에 업데이트를 한 기기에서. 때문에 원인을 파악하는 것도 쉽게할 수 있었다. 3. 원인 파악 원인은 2021년 9월 경에 iOS 15버전 업데이트였다. 이때 Safari도 대거 업데이트 되면서 엔진 Webkit 또한 업데이트 되었다. Text in HTML Buttons is blue on iOS 15 에 따르면, 버튼에 명시적인 color 지정이 없는 경우 Us..
replaceAll is not a function 1. 화이트 아웃 이슈가 발생하다. 회사에서 운영중인 서비스의 결제 페이지에서 화이트아웃 이슈가 발생한 적이 있었다. 해당 사항은 CS팀에서 개발팀으로 빠르게 전달되었고 중요한 페이지에서의 오류인 만큼 핫이슈로 처리되어야했었다. 2. 상황 재현 원인을 파악하기 위해서 상황을 재현해내어야 했다. (프론트엔드 에러 로그 시스템이 전무하다...) 결제 페이지를 webpack dev server에서, 다른 브라우저에서, real 서버에서 접근을 하여도 상황이 재현되지 않았다. 이를 보아, 기기에서 재현되는 오류일거라고 생각한 나는 테스트 기기를 사용하여 해당 페이지에 접근하였는데 특정 AOS 기기에서만 상황이 재현되었다. 곧바로 해당 기기를 연결하여 웹뷰 디버그 모드로 에러 메시지를 확인했는데, replaceA..

티스토리툴바