https://www.youtube.com/watch?v=VrFnJvcBXm4&list=PLYlZbv3fX7WvaWMB9zRgbO7Hzf3MRgrIf&index=18

다음 영상과 교재 참고하여 작성했습니다.

0. 시작 전 계획 단계

1. 모듈을 생성하고 빌드 gradle 수정
2. 실습 파일 복사
3. manifest 수정
4. item, page model class 작성
5. MyApplication.kt 작성 => Retrifit
6. 리사이클러뷰의 어댑터 작성
7. Retrofit의 인터페이스 작성
8. 프래그먼트 작성
9. 앱 실행

1. 모듈, gradle, manifest 설정

새 모듈 Network를 만들어준다.

build.gradle (Module. 생성한 모듈명) 에서
1) viewBinding 설정해준다.

viewBinding{
        enabled = true
    }

2) 사용할 라이브러리를 등록해준다.

implementation 'com.android.volley:volley:1.2.1'
    //retrofit
    implementation 'com.squareup.retrofit2:retrofit:2.9.0'
    implementation 'com.google.code.gson:gson:2.8.9'
    //parser 지정
    implementation 'com.squareup.retrofit2:converter-gson:2.9.0'
    implementation 'com.github.bumptech.glide:glide:4.12.0'

이 라이브러리들이 궁금해서 안드로이드 디벨로퍼 공식 사이트를 찾아봤다.

https://developer.android.com/training/volley?hl=ko

🏐 Volley
Volley는 Android 앱의 네트워킹을 더 쉽고, 무엇보다도 더 빠르게 하는 HTTP 라이브러리입니다. Volley는 GitHub에서 사용할 수 있습니다.
Volley는 UI를 채우기 위해 사용되는 RPC 유형 작업(예: 검색결과 페이지를 구조화된 데이터로 가져오기)에 탁월합니다. 모든 프로토콜과 쉽게 통합되며 원시 문자열, 이미지 및 JSON 지원을 즉시 사용할 수 있습니다. 필요한 기능에 대한 기본 지원을 제공하여 사용자의 앱에 맞는 로직에 집중할 수 있습니다.

Volley는 파싱하는 동안 모든 응답을 메모리에 유지하므로 대규모 다운로드 또는 스트리밍 작업에는 적합하지 않습니다. 대규모 다운로드 작업은 DownloadManager와 같은 대안을 사용하는 것이 좋습니다.

과정

• 간단한 요청 보내기
  Volley의 기본 동작을 사용하여 간단한 요청을 보내는 방법 및 요청을 취소하는 방법을 설명합니다.
• RequestQueue 설정
  RequestQueue 설정 방법과 싱글톤 패턴을 구현하여 앱의 전체 기간 동안 지속하는 RequestQueue를 만드는 방법을 설명합니다.
• 표준 요청 실행
  Volley의 기본 요청 유형(원시 문자열, 이미지, JSON) 중 하나를 사용하여 요청을 보내는 방법을 설명합니다.
• 맞춤 요청 구현
  맞춤 요청 구현 방법을 설명합니다.

👩🏻 => 간단한 요청 및 응답으로 HTTP 통신을 쉽게 도와주는 라이브러리이다. 이 라이브러리로 API 호출, 데이터 가져오고 하나보다.

3) manifest 파일에 인터넷 퍼미션 등록

<uses-permission android:name="android.permission.INTERNET"/>

4) 깡쌤 안드로이드 공식 사이트에서 구글 문서로 실습 파일을 공유 받아서 붙여주었다.
여기에 activity파일이 하나 있기 때문에 <application 안에

android:name="com.example.ch18_network.MyApplication"

등록해준다.

2. item, page model class 작성

😶 com/example/newsapp/model/ItemModel.kt

ItemModel class에 property를 작성해준다.
=> 데이터를 표현하는 모델
이 데이터는 volley, retrofit으로 부터 받은 데이터인데,
volley로부터 받은 네트워크 데이터는 개별 property에 대입시켜주면 된다.
retrofit은 데이터를 자동으로 객체 생성해서 property에 담아준다. 자동으로 되다보니, 서버로부터 바든 key와 property의 이름이 중요하다.

😶 com/example/ch18_network/model/PageListModel.kt

목록 데이터 => 이 중 하나가 ItemModel
신문기사 데이터를 가져올거다.

3. MyApplication.kt 작성

1) api key 발급받기

😶 com/example/ch18_network/MyApplication.kt

package com.example.ch18_network

import android.app.Application
import com.android.volley.toolbox.Volley
import com.example.ch18_network.retrofit.NetworkService
import retrofit2.Retrofit
import retrofit2.converter.gson.GsonConverterFactory

class MyApplication: Application() {

    companion object {
        val QUERY = "travel"
        val API_KEY = "발급받은 키"
        val BASE_URL = "https://newsapi.org"
        val USER_AGENT = "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.113 Safari/537.36"
    }

}

https://newsapi.org/register
위 링크에서 api key를 발급받는다. 금방 된다.

2) Retrofit 초기화/초기 설정

어디에선가 딱 한번만 해주면 된다.

😶 com/example/ch18_network/MyApplication.kt

var networkService: NetworkService
        //retrofit 객체 초기화
        val retrofit: Retrofit
            get() = Retrofit.Builder()
                .baseUrl(BASE_URL)
                .addConverterFactory(GsonConverterFactory.create())
                .build()
        init{
            networkService = retrofit.create(NetworkService::class.java)
        }

추가설명:
GsonConverterFactory 라이브러리를 통해 데이터 converting 할것임
인터페이스 타입으로 실제 네트워킹 가능하게 클래스를 이용

4. RecyclerView Adapter

😶 com/example/ch18_network/recycler/MyAdapter.kt

package com.example.ch18_network.recycler

import android.content.Context
import android.view.LayoutInflater
import android.view.ViewGroup
import androidx.recyclerview.widget.RecyclerView
import com.bumptech.glide.Glide
import com.example.ch18_network.databinding.ItemMainBinding
import com.example.ch18_network.model.ItemModel


class MyViewHolder(val binding: ItemMainBinding): RecyclerView.ViewHolder(binding.root)

class MyAdapter(val context: Context, val datas: MutableList<ItemModel>?): RecyclerView.Adapter<RecyclerView.ViewHolder>(){

    override fun getItemCount(): Int{
        return datas?.size ?: 0
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder
            = MyViewHolder(ItemMainBinding.inflate(LayoutInflater.from(parent.context), parent, false))

    override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {
        val binding=(holder as MyViewHolder).binding
    }
}

전체 데이터가 recycler view에 의해 나올거다.
항목을 구성해서 -> 이미지(서버에서 다운받은) -> glide 활용
=> onBindViewHolder 함수에 작성

이미지 핸들링에 가장 편한 라이브러리가 glide임.

val model = datas!![position]
        binding.itemTitle.text = model.title
        binding.itemDesc.text = model.description
        binding.itemTime.text = "${model.author} At ${model.publishedAt}"
        Glide.with(context)
            .load(model.urlToImage)
            .into(binding.itemImage)

Glide로 이미지 로드하면 엄청 간단하다!

5. Retrofit 인터페이스 작성

😶 com/example/ch18_network/retrofit/NetworkService.kt

package com.example.ch18_network.retrofit

import retrofit2.http.GET
import retrofit2.http.Query

interface NetworkService {
    @GET("/v2/everything")
    fun getList(
        @Query("q") q:String?,
        @Query("apiKey") apiKey:String?,
        @Query("page") page:Long,
        @Query("pageSize") pageSize:Int
    ): Call<PageListModel>
}

• "/v2/everything" => 이 URL로 서버 요청을 보내면서, 매개변수값으로 apiKey, page, pageSize 서버로 전달

• 리턴타입은 네트워킹할 수 있는 Call객체 => 결과 타입은 PageListModel.

6. fragment 작성

1) Volley fragment

😶 com/example/ch18_network/VolleyFragment.kt

//retroft은 자동이지만 volley는 아래처럼 직접 작성
        val url = MyApplication.BASE_URL+"/v2/everything?q="+
                "{${MyApplication.QUERY}&apiKey=${MyApplication.API_KEY}&page=1&pageSize=5"

QUERY=검색어, 나머지 변수들 => 서버에 넘어감

val queue = Volley.newRequestQueue(activity)

: Volley 쪽 네트워크 요청자
이 객체로 request add하면 서버와 연동됨!!!!

val jsonRequest = object: JsonObjectRequest (
            Request.Method.GET,
            url,
            null,
            Response.Listener<JSONObject>{ response ->
                val jsonArray = response.getJSONArray("articles")
                val mutableList = mutableListOf<ItemModel>()
                for(i in 0 until jsonArray.len()){
                    ItemModel().run{
                        val article = jsonArray.getJSONObject(i)
                        author = article.getString("author")
                        title = article.getString("title")
                        description = article.getString("description")
                        urlToImage = article.getString("urlToImage")
                        publishedAt = article.getString("publishedAt")
                        mutableList.add(this)
                    }
                }
                binding.volleyRecyclerView.layoutManager = LinearLayoutManager(activity)
                binding.volleyRecyclerView.adapter = MyAdapter(activity as Context, mutableList)
            },
            Response.ErrorListener{
                Log.d("error", "error...$it")
            }
        )

요청자에게 정보를 줘야함. 넘어온 데이터를 어떻게 핸들링 하는지
=> request 객체

추가설명
val jsonRequest = object: JsonObjectRequest (
Request.Method.GET,
url,
null,
Response.Listener< JSONObject >
=> volley 쪽
최소한의 정보: GET 방식으로, 서버요청 url, 에러 리스너:null, 데이터가 넘어왔을때의 데이터 틀 = callback = Response.Listener< JSONObjet >

Response.Listener< JSONObject >{ response ->
val jsonArray = response.getJSONArray("articles")
val mutableList = mutableListOf< ItemModel >()
=> 정상적으로 데이터를 받았을 때 실행되었을 때의 결과값
json 키 값 = articles, 여러개니까 array type
각각 신문기사 하나를 ItemModel에 담기 위해 mutableList

for(i in 0 until jsonArray.len()){
ItemModel().run{
val article = jsonArray.getJSONObject(i)
author = article.getString("author")
title = article.getString("title")
description = article.getString("description")
urlToImage = article.getString("urlToImage")
publishedAt = article.getString("publishedAt")
mutableList.add(this)
}
}
=> for문이 돌면서, 신문기사 하나에 대한 json object를 얻어내서,
그 json object의 키 값이 "author"인 데이터를 ItemMoodel의 변수 author에 담는다.

빨간줄이 뜨는건 매개변수가 하나 더 있어서 아직 다 작성하지 않아서 그어진 것일거다..

binding.volleyRecyclerView.layoutManager = LinearLayoutManager(activity)
binding.volleyRecyclerView.adapter = MyAdapter(activity as Context, mutableList)
},
Response.ErrorListener{
Log.d("error", "error...$it")
}
)
=> 서버로 부터 받은 데이터가 for문을 통해 다 준비가 되었다고 하면,
recyclerView로 구성해줘야되니까 그 준비작업임.

Response.ErrorListener: 실패 시의 callback

👩🏻 => 그러니까,
위 코드들은 결국 생성자의 4번째 매개변수이면서,
서버로부터 정상적으로 결과값이 넘어왔을때 어떻게 처리할거냐,를 나타낸거다!

{
            override fun getHeaders(): MutableMap<String, String> {
                val map = mutableMapOf<String, String>(
                    "User-agent" to MyApplication.USER_AGENT
                )
                return map
            }
        }

        return binding.root
    }

=> 요청 시의 설정! 헤더값 설정

val map = mutableMapOf<String, String>

=> map 객체를 이 함수에서 return함 => 자동으로 map 객체가 request header 값에 지정이 된다.
그렇기 때문에 항상 헤더값도 key, value로 표현된다.

=> return 시킨 map이 request header 값으로 들어간다.

👩🏻 => 결국 네트워킹할 수 있는 queue객체, 네트워크 시 어떤 정보 및 콜백들을 등록할 request도 준비했다.
**이제 실제 네트워크 시도는 queue 객체에 request를 담으면 된다.

queue.add(jsonRequest)

=> 이 순간 네트워킹이 된다. 결과에 따라 response 콜백 함수 혹은 error시 콜백 함수가 실행된다.

2) Retrofit fragment

😶 com/example/ch18_network/RetrofitFragment.kt

네트워킹을 하기 위해서는 call 객체가 있어야 한다.
=> 인터페이스 함수로 얻어낼 수 있음

val call: Call<PageListModel> = MyApplication.networkService.getList(
            MyApplication.QUERY,
            MyApplication.API_KEY,
            1,
            10
        )

콜 객체는 네트워킹이 가능할 뿐, 네트워킹을 실행하려면 명령을 따로 내려줘야된다.
네크워킹 실행 명령: enqueue
=> call?.enqueue()

서버에서 넘어오거나, 실패하거나 -> 얘도 call back 등록해야됨

call?.enqueue(object: Callback<PageListModel>{
            override fun onResponse(call: Call<PageListModel>, response: Response<PageListModel>){
            }
            override fun onFailure(call: Call<PageListModel>, t: Throwable) {
            }
        })

=> callback 안에 성공시, 실패시 케이스 2개

성공 시:

override fun onResponse(call: Call<PageListModel>, response: Response<PageListModel>){
                if(response.isSuccessful){
                    binding.retrofitRecyclerView.layoutManager = LinearLayoutManager(activity)
                    binding.retrofitRecyclerView.adapter = MyAdapter(activity as Context,
                        response.body()?.articles
                    )
                }
            }

if(response.isSuccessful): 성공했으면,
똑같이 화면구성!

실패했을경우 간단히 Log만 찍어줌.

=> retrofit: 목적과 내용이 같은데 volley에 비해 간단하다. 이유는 volley는 모델 클래스에 일일이 담아줘야되는데, 다 자동으로 해주는게 converter.
어디에 담아주면 되는지만 알려주면 됨.

7. 실행해보아요

오..왜 volley는 안뜰까

ㅎㅎ 위에 오타가 있었다. 수정하니 잘 작동!!

스크롤도 잘된다!