Git Product home page Git Product logo

smeme-ios's Introduction

🍎 Smeme-iOS

Frame 34339


🖍 Project

내 일기에 스미는 외국어 일기 서비스, Smeme


🖍 Smeme iOS Developers

황찬미 원종화 백준 임주민
KakaoTalk_Photo_2023-01-04-04-18-16 KakaoTalk_Photo_2023-01-04-04-19-45 KakaoTalk_Photo_2023-01-04-23-17-04 KakaoTalk_Photo_2023-01-04-04-23-27
불꽃 카리스마 리드 군필 공주님 터키 출신 개발자 미성년자
초기 세팅
- Color, Font Custom
- Keyboard 높이에 따른 동적 뷰 메서드 구현

소셜 로그인
- Kakao Social Login API

오픈 일기 게시판 뷰
- UICollectionView

오픈 일기 게시판 상세 뷰
- 동적 UIScrollView
- UIEditMenuInteraction
스크랩 보관함 뷰
- 텍스트 양에 따라 CollectionViewCell 레이아웃 동적으로 구현
- Alert 뷰 구현

마이스밈 뷰(마이페이지)
- 컨테이너 뷰를 활용한 AutoLayout

스플래시 뷰
- Lottie 이용 그래픽 뷰 구현

토스트 메세지
- UIView 와 Animation을 활용해 커스텀 후 함수화
외국어 일기 작성 뷰
, 한국어 일기 작성 뷰

- 파파고 번역 Open API 연결
- 문자열 정규식을 통한 버튼 활성화
- keyboard 감지 시 bottomView 동적 구현
- Constraint Layout을 적용한 동적 뷰 구현
회원가입 뷰
- textField와 button을 포함한 커스텀 뷰

내 일기 뷰(메인)
- 날짜 표시 뷰 Custom
- UICollectionView

내 일기 상세 뷰
- ScrollView
- Floating Action Button
- ScrollView 내 contentView 동적 계산 함수화

디자인 시스템
- RandomSubjectView

Library

사용한 라이브러리 보기

KakaoSDK : 카카오 소셜로그인을 API를 사용할 수 있는 라이브러리
→ 카카오 소셜로그인을 통해 얻은 토큰으로 유저 구분을 쉽게 하기 위해 사용

Lottie : 최소한의 코드로 벡터 기반 애니메이션과 Art를 실시간으로 렌더링하는 라이브러리
→ Lottie 파일을 프로젝트 내에서 쉽게 사용하기 위해 사용

snapkit : autolayout을 코드로 쉽고 편리하게 구현할 수 있도록 도와주는 라이브러리
→ 작성해야 하는 코드의 길이를 줄이고, 가독성을 높여 주기 위해 사용

then : 클로저를 사용하여 직관적이고, 깔끔하게 인스턴스를 생성할 수 있도록 도와주는 라이브러리
→ 인스턴스 생성 후, 속성 설정을 쉽게 하기 위해 사용

Moya : URLSession을 추상화한 Alamofire를 다시 추상화해서, Network Layer를 템플릿화하여 재사용성을 높이고, 개발자는 request와 response에만 신경 쓰도록 도와주는 라이브러리
→ 모듈화된 통신 코드로, 서버 통신을 깔끔하고 편리하게 하기 위해 사용

Coding Convention

코딩 컨벤션 보기
  • Default

    • 기본적으로 Swift Style Guide를 따릅니다.
      • ex) lowCamelCase 따르기
  • Naming

    • 약어 사용을 지양합니다.
      • ex) MainTableViewCell, SettingCollectionViewCell
    • 기본 함수의 네이밍은 set_의 형태를 작성합니다.
      • ex) setLayout, setData
    • Action 함수의 네이밍은 ‘주어+동사+목적어’ 형태를 사용합니다.
      • ex) backButtonDidTap
  • MARK

    • Snippet을 사용해 공통적인 MARK 주석을 작성하고, MARK 구문 다음 한 줄 띄어쓰기 공백을 추가합니다.
class ViewController: UIViewController {
    // MARK: - Property
    // MARK: - UI Property
    // MARK: - Life Cycle
    // MARK: - @objc
    // MARK: - Custom Method
}

// MARK: - UITableView Delegate
  • Extension

    • 필요할 경우, 코드 하단에 작성합니다.
  • ETC

    • 강제 언래핑을 지양합니다.

Git Flow

깃 플로우 보기

개인 로컬 저장소와 공개된 자신의 원격 저장소(중앙 원격 저장소를 fork한 것), 두 개의 저장소로 협업을 진행합니다.

모든 코드 기여자가 중앙 저장소에 푸시하는 것이 아니라, 각자 자신의 원격 저장소에 푸시하고, 이 내용을 중앙 원격 저장소에 Pull Request 합니다.

Pull Request는 기능별로 올리며, 나머지 팀원의 한 명 이상의 승인코드리뷰를 해야 머지가 가능합니다.

Foldering

폴더링 보기
- 🗂️ Resources

  - DesignSystem : Button, TextField 등의 UI Component를 관리하는 디자인 시스템

  - Extension : 기존의 클래스, 구조체, 열거형 타입에 새로운 기능 추가

  - Constant : Asset, Font, ViewController 등을 상수화

  - Support : Info.pilst, App Delegate, Scene Delegate와 같은 프로젝트 기본 파일

  - Color : 프로젝트에서 사용한 Color Asset

  - Font : 프로젝트에서 사용한 폰트 파일

  - Asset : 프로젝트에서 사용한 Image Asset

  - Storyboard : LaunchScreen
  
- 🗂️ Sources

  - Network

      - Base : 네트워크 Base 파일
    
      - API : 네트워크 API 파일
    
      - Service : 네트워크 Service 파일
    
      - DataModel : Request, response 데이터 모델
    
  - Screen

      - MVC 폴더 구조를 사용합니다.

📁 Team Notion

스밈 아요 노션 보러가기 🥴


☄️ 어려웠던 부분, 극복

Slide 16_9 - 128

Slide 16_9 - 127

Slide 16_9 - 124

Slide 16_9 - 126

smeme-ios's People

Contributors

jumining avatar zzongha avatar joonbaek12 avatar cchanmi avatar

Stargazers

 avatar  avatar Yunseo Kang avatar Pham Tuan Anh avatar Minjae Kim avatar Sohyeon Kim avatar Hyungyu Kim avatar su_vera avatar HaeTi avatar  avatar Eugene Jang avatar Younyi Kim avatar Choi Da-in avatar 대환임 avatar Sumin Bae avatar KIM SU BEEN avatar 냄고르 avatar Kim KyungLin avatar Ella avatar Park Hyeon Ji avatar Seyeon Jeong avatar ryanNoh avatar  avatar  avatar ICEMAN avatar Unan avatar Choi Young Lyn avatar

smeme-ios's Issues

[Feat] 스플래시 뷰 로티 구현

Issue

스플래시 뷰를 생성하고 로티 애니메이션을 적용합니다.

To-do

  • 스플래시 뷰 생성
  • 로티 애니메이션 적용
  • 로티 애니메이션 세부 설정

[Feat] 일기 작성 로직

Issue

To-do

  • 영자만 열자 이상 카운팅
  • 작성 완료조건 미달시 작성완료 비활성화처리(회->검)

[Feat] StepTwoKoreanDiary TextView UI 구현

Issue

한국어 일기부터 시작 뷰의 TextView UI를 구현합니다.

To-do

  • 컴포넌트 생성(UITextView, UILabel 2ea)
  • Custom 플레이스 홀더 구현
  • 레이아웃 적용

[Feat] DiaryForeign 뷰 하단 바 UI 구현

Issue

Keyboard와 함께 올라갔다 내려갔다 하는 버튼을 구현합니다.

To-do

  • UIView 생성 2ea
  • UIImageView, UILabel 생성
  • UIView로 UIImageView, UILabel 감싸기

[Feat] 로그인 분기처리

Issue

로그인 분기처리

To-do

  • 토큰이 있고 닉네임 있는 경우 -> 홈 (기존유저, 재로그인)
  • 토큰이 있고 닉네임 없는 경우 -> 닉네임 입력 (회원가입)
  • 토큰이 없는 경우 -> 소셜로그인

[Feat] Step1 BottomView UI 구현

Issue

한국어 일기부터 시작 뷰의 바텀뷰를 구현합니다.

To-do

  • BottomView 컴포넌트 생성
  • BottomView 레이아웃 구현

[Feat] StepOneKoreanDiary TextView UI 구현

Issue

외국어로 일기 작성하기 뷰의 TextView UI를 구현합니다.

To-do

  • 컴포넌트 생성(ScrollView, UITextView)
  • Custom 플레이스 홀더 구현
  • 레이아웃 적용

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.