Ground17's Playground

 유튜브를 보시다 보면 아래와 같은 링크 형태를 흔하게 접하게 됩니다. https://www.youtube.com/watch?v= Y5viKFgccqc  (전체 url) https://youtu.be/ Y5viKFgccqc  (간소화한 url) 여기서 굵은 글씨( Y5viKFgccqc )에 주목해보도록 하겠습니다(지금부터는 이 굵은 글씨를 'v값'으로 부르겠습니다.). 이 11개의 문자는 영상을 올릴 때마다 무작위로 정해지며, 각각의 글자는 대/소문자 알파벳(a ~ Z) 또는 숫자(0~9) 또는 하이픈(-) 또는 언더바(_)로 구성되어 있습니다. 제가 유튜브 모든 영상을 아는 것은 아니기 때문에 이 규칙에 어긋나는 영상 url도 존재할 수 있겠습니다만, 일단은 이 규칙에서 어긋나지 않는다고 가정하겠습니다. 그러면 가능한 v 값의 경우의 수는 얼마나 될까요? 단순히 26(소문자 개수) + 26(대문자 개수) + 10(숫자 개수) + 2(하이픈, 언더바) = 64을 11번 곱하면 될 것 같네요. 그 값은 73,786,976,294,838,206,464 입니다. 따라서 이론적으로 이 규칙을 변경하지 않는 한 유튜브에는 서로 다른 영상을 위 숫자만큼 제공할 수 있습니다. 약 7000경 정도 되네요. 제가 살면서 유튜브의 영상이 이 정도로 쌓일 날이 올까요? 잘 모르겠습니다. 근데 한 가지 궁금증이 생깁니다. 왜 자신의 동영상을 자신이 직접 url을 설정하지 못하고, 구글이 임의로 정해주는 걸까요? 자신이 직접 url을 설정하면 외우기도 쉬울 것이고, 공유도 좀 더 쉬울 텐데 말이죠. 그렇게 하지 않고 위 규칙을 따르는 데에는 많은 이유가 있겠지만, 자신이 직접 url을 설정할 때 생기는 문제점으로 제가 생각한 것들로는 다음과 같습니다. 1. 유튜브 서버 입장에서, 많은 영상들에서 원하는 영상을 빠르게 찾기에 용이하지 않다. 만약 allaroundground라는 이름을 앞에 두고, 뒤에는 숫자를 두는 방식으로 영상을 구분한다고 가정해보겠습니다....

안녕하세요. Ground17입니다. 섬의 지형이 많이 바뀌었습니다. 앞으로 일주일 내로 섬의 전체적인 형태는 다 갖춰질 것 같습니다. 이제 꽃들과 울타리와 가구의 배치를 어떻게 할지를 집중적으로 고민해야 할 것 같습니다. 아래 사진들은 다리와 비탈길 기념식 촬영사진입니다. 아래 사진은 캠핑장 사진입니다. 제 유튜브 영상 에서도 잠깐 소개된 적이 있습니다. 마지막으로 아래 사진은 별 보기 좋은 장소에서 찍은 사진입니다. 트위치 생방송:  https://www.twitch.tv/ground1717 유튜브 하이라이트:  https://www.youtube.com/channel/UCyoRBB-GY_2iTAtnCDiz3Bg 읽어주셔서 감사합니다!

안녕하세요. 오늘은 제가 개발한 앱들을 중심으로 해서 실제 앱 출시가 어떤 과정으로 이뤄지는지를 간략히 소개해드릴까 합니다. 이 게시글은 전공자나 현업자보다는 취미로 앱을 출시하려 하시는 분들이나 단순히 궁금하신 분들을 초점으로 하여 작성된 게시글이고, 영상 자료와 달리 여러 부연 설명들이 들어갑니다. 혹시 틀린 부분이 있다면 댓글로 알려주시면 반영하겠습니다. 사실 어플을 출시하는 데에는 여러 다른 과정들이 필요합니다만, 이 게시글은 '출시' 과정을 초점으로 하여 설명드리겠습니다. 그리고 저는 Flutter, React Native, Unity를 사용해서 모바일 앱을 개발하며, 네이티브 영역은 따로 조금씩 건드리는 방식으로 개발합니다. 이 점도 참고해주시면 감사하겠습니다. 설명을 영상으로 보고 싶으신 분들은 아래 동영상 혹은 링크를 눌러주세요. 저의 개발자 유튜브 채널의 동영상입니다. https://youtu.be/L5sPALeWQro 0. 배경지식 Android의 경우엔 공식적으로 Java 또는 Kotlin이라는 언어를, iOS의 경우엔 공식적으로 Objective-C 또는 Swift라는 언어를 사용해서 개발하게 됩니다. 하지만 한 명의 인디 개발자가 각각의 OS에 각각 다른 언어를 써서 개발한다는 건 쉬운 일이 아닙니다. 또한 Android 기기와 iOS 기기의 특성이 약간씩 다르기 때문에 그에 맞춰 코드를 짜줘야 합니다. 그런데 구글과 페이스북, Unity에서 코드를 한 번만 써서 Android와 iOS에 동시 적용 가능하도록 하는 개발 엔진을 만들었습니다. 각각 Flutter, React Native, Unity입니다. Flutter와 React Native는 크로스 플랫폼(두 가지 이상의 OS를 개발할 수 있는 플랫폼)의 양대산맥이며, 각각의 장단점을 비교하는 글이나 영상은 다른 곳에 많이 나와있으니 궁금하신 분들은 직접 찾아보시길 추천드립니다. Unity는 게임에 특화된 개발엔진이며, Android와 iOS 외에도 STEAM, PS4,...

React Native의 장점이라 한다면 자신이 직접 Native 코드를 작성할 필요 없이 이미 만들어진 패키지를 설치해서 그대로 쓰면 된다는 것입니다. 이미 아시는 분들에겐 매우 쉬운, React Native에서의 패키지 설치 방법을 알려드릴까 합니다. 1) https://www.npmjs.com 홈페이지에서 원하는 패키지 찾기 2) 터미널에 'npm install (패키지 이름)' 형태로 입력 ( react-native link 는 react-native 버전이 0.60 미만인 경우에서만 진행 ) 2-1) iOS의 경우 cd ios를 한 뒤 pod install 명령어를 터미널에 입력 3) package.json 파일을 열어 dependencies 안에 패키지 이름이 제대로 들어있나 확인 4) 설치한 패키지의 파일을 import해준 뒤 npmjs.com 안 가이드라인대로 코드 작성 한꺼번에 패키지를 설치할 때는 'npm install (패키지 이름1) (패키지 이름2) ... (패키지 이름n)'의 형태로 입력해주시면 됩니다.

Flutter의 장점이라 한다면 자신이 직접 Native 코드를 작성할 필요 없이 이미 만들어진 패키지를 설치해서 그대로 쓰면 된다는 것입니다. 이미 아시는 분들에겐 매우 쉬운, Flutter에서의 패키지 설치 방법을 알려드릴까 합니다. 1) pubspec.yaml 파일로 이동 2) pub.dev 홈페이지에서 원하는 패키지 찾기 3) pubspec.yaml의 dependencies 안에 원하는 패키지와 버전을 입력 (예: 'url_launcher: ^5.7.10', 버전들은 pub.dev 안에 자세히 나와 있습니다.) 4) flutter pub get 실행 (Android Studio를 사용하시는 분은 상단의 Pub get을 입력하시면 됩니다.) 4-1) iOS의 경우 cd ios를 한 뒤 pod install 명령어를 터미널에 입력 5) 설치한 패키지의 dart 파일을 import해준 뒤 pub.dev 안 가이드라인대로 코드 작성 (Android Studio의 경우, 아래 그림처럼 'Pubspec has been edited'라는 막대 바가 뜨는 경우가 있는데, 바로 Get dependencies를 누르면 정상적으로 동작합니다) 한꺼번에 패키지를 설치할 때는 그냥 여러 패키지를 엔터로 구분하여 작성하여 위 과정을 한 번만 진행해주시면 됩니다.

일단, 이 글에서는 제가 자주 쓰는 화면 전환법들만 다뤘음을 밝히며, 더 자세한 사항을 알아보고 싶으신 분들은 아래 공식 문서나 다른 문서들을 참고하시는 것이 더 좋을 것입니다. https://reactnavigation.org/docs/getting-started 모든 과정을 시작하기 앞서, 아래 패키지들을 설치해줍니다. npm install react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context @react-native-community/masked-view 만약 tab view와 stack view도 사용한다면 아래 패키지들도 추가로 설치해줍니다. npm install @react-navigation/bottom-tabs @react-navigation/stack 아래는 기본적인 화면을 구성하는 코드입니다.(function 형식보단 class 형식이 더 많습니다) App.js import 'react-native-gesture-handler' ; import { NavigationContainer } from '@react-navigation/native' ; import { createStackNavigator } from '@react-navigation/stack' ; import { createBottomTabNavigator } from '@react-navigation/bottom-tabs' ; import Icon from 'react-native-vector-icons/MaterialIcons' ; import Login from './assets/screens/Login' ; const Stack = createStackNavigator (); const Tab = createBottomT...