분류 전체보기 491

React JS 개념 잡기 - 빠르게 한 번 훑어보고 싶다면

JSX 뜻 JSX는 Javascript의 확장으로 Javascript의 이점을 그대로 사용할 수 있다. 때문에 {} 안에 Javascript 코드를 그대로 사용할 수 있다. 아래는 JSX의 예인데, 마치 HTML 태그처럼 생겼다. 하지만 HTML 태그처럼 적어도 되는건 문법적인 허용이고, 실제로는 Javascript로 변환되어 아래와 같은 React Element로 바꾼다. const element = ( Hello, World! ) const element = React.createElement( 'h1', {className: 'greeting'}, 'Hello, world!' ); Virtual DOM은 React에서 어떻게 동작하는가 React는 가상의(Virtual) DOM을 생성하는데, Com..

[Kotlin/Java] 닉네임 정규식, 닉네임 유효성 검사하기

조건: 숫자, 영어, 한국어와 언더스코어, 공백을 허용하며 최소 2자 이상의 닉네임 만약에 공백을 하용하지 않을 경우 정규식을 다음과 같이 변경 ^[가-힣ㄱ-ㅎa-zA-Z0-9._-]{2,}\$ fun isValidNickname(nickname: String?): Boolean { val trimmedNickname = nickname?.trim().toString() val exp = Regex("^[가-힣ㄱ-ㅎa-zA-Z0-9._ -]{2,}\$") return !trimmedNickname.isNullOrEmpty() && exp.matches(trimmedNickname) }

[Kotlin/Java] 숫자를 K, M, B 단위로 줄여서 표시하기

오늘부터 꾸준히... 유용한 함수가 있으면 올릴려고 한다. 마음 먹는게 중요한 거니까~ 아래 함수를 이용하면 10,000을 10K로 표시할 수 있다. fun formatNumber(value: Long): String { return when { value >= 1E9 -> "${(value.toFloat() / 1E9).toInt()}B" value >= 1E6 -> "${(value.toFloat() / 1E6).toInt()}M" value >= 1E3 -> "${(value.toFloat() / 1E3).toInt()}K" else -> NumberFormat.getInstance().format(value) } }

[안드로이드] Keytool을 이용해 KeyHash, SHA-1 얻기

안드로이드 키 해시 얻는 방법, 터미널에서 아래와 같이 입력 해 주면된다. 디버그 Keyhash 확인법 keytool -exportcert -alias androiddebugkey -keystore ~/.android/debug.keystore -storepass android -keypass android | openssl sha1 -binary | openssl base64 릴리즈 Keyhash 확인법 디버그 확인 코드랑 같은데 variable만 다르다. keytool -exportcert -alias gnacompany -keystore -storepass -keypass | openssl sha1 -binary | openssl base64 디버그 SHA-1 / SHA-256 확인법 keytool..

Catalina 이후 맥북 터미널 환경변수 PATH 설정법 (zsh: command not found:)

오늘 새 맥북을 사고 여러가지 깔고있는데 환경변수 설정을 터미널을 켤때마다 해줘야 하는거였다! source ./bashrc 왜 이럴까..왜 이렇게 귀찮게 되어있을까 싶었는데 자세히 보니 예전 쓰던 맥북(Mojave)은 어떤 명령어를 찾을 수 없을때 -bash가 앞에 붙어서 알려주고는 했는데 새로운 M1 맥북(Big sur)에서는 zsh가 앞에 붙어있었다. 찾아보니 Mac OS X Catalina 부터 zsh(Z shell)이 기본 쉘로 변경되었다고 한다. 맨날 bash shell만 봤었는데 찾아보니 이 녀석 역사가 깊었다. -bash: : command not found zsh: command not found 터미널을 켤때 .zshrc가 작동하는 거였고, 그래서 .zshrc 파일을 만들어서 .bashr..

마인크래프트 1.16.4 화폐·상점 플러그인 무료 배포

직접 개발한 마인크래프트 1.16.4+ spigot 화폐 플러그인을 무료 배포합니다. 화폐 플러그인 이외에도 여러 유틸기능이 추가되어있는 플러그인이니 충돌에 유의 해 주세요! 화폐 이미지는 배리어(Barrier) 리소스팩을 바꿔주시면됩니다. 개인적인 필요에 의해 맞춤제작한거지만 친구들끼리 간단하게 멀티시작하고자 할때 하나 넣어서 사용하면 좋을 것 같아서 배포하게되었습니다! 최신 마인크래프트에서 돌아가는 화폐나 상점 플러그인을 찾기 어렵기도 했구요 ㅎㅎ 도움이 되셨다면 ...올드하지만 공감 꾹~ 눌러주세요! 하.. 플러그인 다운로드 링크 https://www.dropbox.com/s/qfgd3a9l8lphxwa/RailKorea.jar?dl=0 필수 라이브러리 아래 사이트에 서 첨부한 사진처럼 Protoc..

[Node.js] Selenium 사용법을 익혀보자

Selenium은 웹 드라이버를 통해 웹 브라우저를 자동화하여 웹 테스트를 도와주는 툴이다. 말은 착하지만 매크로를 만들거나 크롤링 할때도 도움이 된다. ^^ 실제 브라우저를 띄우고 코드를 수행할 수 있으며, 일반적으로 크롤링 하는 방식보다 훨씬 더 상호작용을 사람같이! 할 수 있다. 페이지가 다 뜰때까지 기다리고, 클릭하고, 입력하는 등... 그러면 Node.js 에서 selenium을 사용하는 방법을 익혀보자. 패키지 설치 먼저 selenium-webdriver 패키지를 설치해야한다. npm i selenium-webdriver 파이어 폭스 브라우저로 Selenium을 실행해야 할 경우, geckodriver를 설치해야한다. npm i geckodriver 실행환경이 Ubuntu일 경우 geckodr..

[안드로이드] 주요 이미지 라이브러리 메모리 사용량 비교해보기! (Glide vs Picasso vs Coil)

안드로이드에서 Glide, Picasso, Coil 등 선택할 수 있는 이미지 라이브러리(Image library)의 폭은 넓다. 뭐 대부분 그냥 닥치고 글라이드! 하긴하지만, 메모리 관리 측면에서 누가 젤 잘하는지 항상 속으로 궁금했다... 주말에 심심하니까 간단히 테스트 해봤다. 비교군 - Glide: 1군 - Picasso: 2인자 - Coil: 떠오르는 신예 앱 기능 앱 자체는 간단하다. 화면 하나에 엄청나게 큰 이미지 목록을 보여주는거다. RecyclerView에 Adapter를 붙이고 로드! Coil 같은 경우에는 이미지 곡선처리하는데 이미지뷰 자체가 아닌 이미지 자체를 곡선처리 해버려서 모든 라이브러리가 곡선처리는 따로 하지 않도록 RoundedImageView라는 라이브러리를 사용하여 이미..