TodoList-CI4-Restful

Aplikasi TodoList Android menggunakkan CodeIgniter4 berbasis Restful-API.

Proses BackEnd dari Restful-API menggunakan CodeIgniter4 pada link berikut : https://github.com/sabo99/codeigniter4_RestfulAPI_TodoList

Fitur Aplikasi TodoList :

• CodeIgniter4
  • Upload Image (MultiPart)
  • Restful API (POST | GET | PUT | DELETE)
• API JavaMail (Gmail Verification Code)
  • Log In with 2nd Auth
  • Edit User
• SweetAlertDialog
  • Modal Dialog with Custom Content View
  • Message Dialog
  • Loading Dialog
• Lottie Animation
  • Response Code : 404 | 500
    

Important!

Config JavaMail APIs

In the file Credentials.kt change the following line with the email that will be used as Sender

object Credentials {
    const val EMAIL_SENDER = "your_email"
    const val PASSWORD_SENDER = "your_password"
}

Change API BASE URL

Change the API BASE URL in the following file RestfulAPIService.kt

class RestfulAPIService {
    companion object {
        private const val URL = "http://192.168.1.8/ci4todolist-restfulapi/public/"
    }
}

Dependencies used

    implementation 'com.squareup.retrofit2:retrofit:2.9.0'
    implementation 'com.squareup.retrofit2:converter-gson:2.9.0'
    implementation 'com.github.thomper:sweet-alert-dialog:1.4.0'
    implementation 'de.hdodenhof:circleimageview:3.1.0'
    implementation 'com.squareup.picasso:picasso:2.71828'
    implementation 'com.facebook.shimmer:shimmer:0.5.0'
    implementation "com.airbnb.android:lottie:3.7.1"
    implementation 'org.greenrobot:eventbus:3.2.0'
    implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.1.0'
    api 'com.theartofdev.edmodo:android-image-cropper:2.8.+'

    implementation 'com.sun.mail:android-mail:1.6.0'
    implementation 'com.sun.mail:android-activation:1.6.0'

Integration Step Used Binding in Kotlin

1. Add viewBinding = true build.gralde (Module)

android {

   buildFeatures {
      viewBinding = true
   }
}

2. Activity Kotlin Class

class MainActivity : AppCompatActivity() {

    /** Add this */
    private lateinit var binding: ActivityMainBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        /** Add this */
        binding = ActivityMainBinding.inflate(layoutInflater)
        /** Change this */
        setContentView(binding.root)

        /** Without findViewById */
        binding.textView.text = "Bye bye findViewById"
    }
}

3. Activity Java Class

public class MainActivity extends AppCompatActivity {

    /** Add this */
    private ActivityMainBinding binding;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        /** Add this */
        binding = ActivityMainBinding.inflate(getLayoutInflater());
        /** Change this */
        setContentView(binding.getRoot());

        /** Without findViewById */
        binding.textView.setText("Bye bye findViewById");
    }
}

binding in kotlin can be used directly without initializing findViewById on widgets in layout xml

Design UI App TodoList

Login (Activity)

Forgot Password (Modal / SweetAlertDialog)

Setelah meng-input email address yang telah terdaftar di database pada form email (Forgot Password), sistem akan mengirimkan kode verifikasi melalui email tersebut dengan tampilan UI seperti dibawah ini

Kemudian user (pengguna) diminta untuk menginputkan password baru beserta kode verifikasi yang telah dikirimkan melalui email.

SignUp (Activity)

Main / Home (Activity)

Create Todo (Activity with Modal / SweetAlertDialog)

Detail Todo (Activity)

Edit Todo (Activity with Modal / SweetAlertDialog)

Delete Todo (Modal / SweetAlertDialog)

Profile (Activity)

Edit Profile (Activity with Card)

Edit Username (Modal / SweetAlertDialog)

Edit Email (Modal / SweetAlertDialog)

Setelah menginput "new email address" dan "current password", sistem akan mengirimkan kode verifikasi melalui email tersebut dengan tampilan UI seperti dibawah ini

Kemudian user (pengguna) diminta untuk melakukan validasi terhadap kode verifikasi yang telah dikirimkan melalui email.

Edit Password (Modal / SweetAlertDialog)

Two Factor Authentication (Modal / SweetAlertDialog)

Setelah menginput "current password", sistem akan mengirimkan kode verifikasi melalui email tersebut dengan tampilan UI seperti dibawah ini

Kemudian user (pengguna) diminta untuk melakukan validasi terhadap kode verifikasi yang telah dikirimkan melalui email.

Delete Account (Modal / SweetAlertDialog)

Log Out (Modal / SweetAlertDialog)