Android - Github API 검색 (TIL 05.08)

Postman 사용하기 (TIL 05.02)

Github API 사용하기 | Notion

 

postman으로 api test는 이전에 진행해서 패스

위에 노션으로 정리 해 두었다.

 

바로 코드 작성

RetrofitClient.kt

object RetrofitClient { [1]
    private const val BASE_URL = "https://api.github.com/" [2]

    private val okHttpClient by lazy { [3]
        OkHttpClient.Builder()
            .build()
    }

    private val retrofit by lazy { [4]
        Retrofit.Builder()
            .baseUrl(BASE_URL)
            .client(okHttpClient)
            .addConverterFactory(GsonConverterFactory.create()) [5]
            .build()
    }
}

[1] 싱글톤 객체 생성

[2] github api의 기본 URL 세팅

[3] OkHttpClient 생성

[4] Retrofit 생성

[5] JSON -> Gson으로 변환

retrofit을 사용하기 위한 세팅이다.

 

GitHubUserResponse.kt

위에 노션에서 어떤 데이터를 사용할지 정했다.

사용자 아이디(login), 깃헙 주소(html_url), 프로필 사진(avatar_url)

JSON을 Gson을 사용해서 Kotlin 객체로 변환하기 위한 data class를 정의한다.ㅏ

data class GitHubUserListResponse (
    @SerializedName("items") val items : List<GitHubUserResponse>
)

data class GitHubUserResponse(
    @SerializedName("login") val login : String,
    @SerializedName("id") val id : Int,
    @SerializedName("html_url") val htmlUrl : String,
    @SerializedName("avatar_url") val avatarUrl : String,
)

@SerializedName 어노테이션으로 JSON의 key 값과 Kotlin 클래스의 프로퍼티를 매핑하는데 사용된다.

 

 

 

 

SearchRemoteDataSource.kt

interface SearchRemoteDataSource {
    @Headers("Authorization: ${BuildConfig.API_KEY}") [1]
    @GET("search/users") [2]
    suspend fun getGitHubUser(
        @Query("q") name: String,
        @Query("page") page: Int = 1,
        @Query("per_page") perPage: Int = 100,
        ) : GitHubUserListResponse
}

[1] Api key local.properties로 옮겨주었다.(지난번 TIL에 작성) github의 경우 "Bearer 개인 key입력" 형식으로 넣어주면 된다.

[2] GET 요청 뒤에 붙여서 github의 유저 API를 검색할 수 있게 한다.

나머지 Query는 API마다 다르므로 각 API공식문서를 통해 확인하면 된다.

 

 

 

 

 

 

RetrofitClient.kt (코드 추가)

이제 retrofit 객체와 interface를 연결해준다.

 val searchGitHubUser: SearchRemoteDataSource by lazy { retrofit.create(SearchRemoteDataSource::class.java) }

생성한 Retrofit 객체를 SearchRemoteDataSource 인터페이스를 구현한다.

 

 

SearchRepositoryImpl.kt

class SearchRepositoryImpl(private val remoteDataSource: SearchRemoteDataSource): SearchRepository {

    override suspend fun getGitHubUserList(userName: String): GitHubUserListEntity =
//        remoteDataSource.getGitHubUser(userName) //mapper 필요!
        remoteDataSource.getGitHubUser(userName).toEntity()
}

GitHubUserListResponse -> GitHubUserListEntity로 변환하기 위한 클래스이다.

 

GitHubUserEntity.kt

@Parcelize
data class GitHubUserListEntity(
    val items: List<GitHubUserEntity>
):Parcelable

@Parcelize
data class GitHubUserEntity(
    val login: String,
    val id: Int,
    val htmlUrl: String,
    val avatarUrl: String,
    val isLiked: Boolean = false
):Parcelable

사용하기 위한 data class 정의

 

 

SearchRepository.kt

interface SearchRepository {
    suspend fun getGitHubUserList(userName: String) : GitHubUserListEntity
}

userId(login)를 넣어 해당하는 유저를 가져오기 위함

 

 

GitHubUserMapper.kt

fun GitHubUserListResponse.toEntity() = GitHubUserListEntity( [1]
    items = items.asGitHubUserEntity()
)
fun List<GitHubUserResponse>.asGitHubUserEntity() : List<GitHubUserEntity>{
    return map{
        GitHubUserEntity(
            it.login,
            it.id,
            it.htmlUrl,
            it.avatarUrl
        )
    }
}

GitHubUserListResponse 와 GitHubUserResponse 클래스를 GitHubUserEntity로 변환하기 위한 Mapper이다.

map을 사용해서 각 GitHubUserResponse를 GitHubUserEntity로 변환

 

 

이제 RecyclerView와 Adapter를 만들어 준 뒤 잘 설정해 주고 나서

해당ViewModel.kt

class SearchViewModel(private val searchRepository: SearchRepository) : ViewModel() {

    private val _getGitHubUserList: MutableLiveData<List<GitHubUserEntity>> = MutableLiveData()
    val getGithubUserList: LiveData<List<GitHubUserEntity>> get() = _getGitHubUserList

    fun getGitHubUserList(userName: String) { //검색어 넣으면 됨
        viewModelScope.launch {
            _getGitHubUserList.value = searchRepository.getGitHubUserList(userName).items
        }
    }
}

 

 

사용Fragment.kt

    private fun setUpSearchClickListener() {
        btnSearch.setOnClickListener {
            val searchWord = etSearchUser.text.toString()
            viewModel.getGitHubUserList(searchWord)
        }
    }
    private fun setUpViewModel() {
        viewModel.getGithubUserList.observe(viewLifecycleOwner) { userList ->
            userList?.let {//null 일 경우 앱 종료됨
                adapter.submitList(userList)
            }
        }
    }

 

 

결과

---

 

+ SharedPreferences로 검색어 저장

+ 선택했을 경우 프로필 위에 아이콘 생성 및 보관함으로 이동 (Room 저장)

+ 검색 SearchView로 바꿔서 밑에 연관검색어 뜨게 하기