Aplikasi e-commerce seluler Open Source Open Source Dibuat dengan MongoDB, Express, React Native dan Nodejs
- Konfigurasi dan Pengaturan
- Fitur utama
- Teknologi digunakan
- Frontend (Mobile)
- Backend
- Database
- ? Mockups
- ? Video Proyek
- Pengarang
- Lisensi
Konfigurasi dan Pengaturan
Untuk menjalankan proyek ini secara lokal, cukup garpu dan klon repositori atau unduh sebagai zip dan unzip pada mesin Anda.
- Buka proyek di editor kode yang Anda sukai.
- Pergi ke Terminal -> Terminal Baru (jika Anda menggunakan VS Code)
- Pertama, Anda perlu menjalankan server NGROK. Server ini tidak boleh ditutup untuk pekerjaan proyek
- Kemudian buka terminal yang berbeda. Pisahkan terminal Anda menjadi dua (jalankan server di satu terminal dan klien di yang lain)
Ngrok adalah perangkat lunak yang memungkinkan kami untuk membuka aplikasi kami yang kami jalankan di LocalHost di komputer kami sendiri, di atas cloud, di bawah sub-domain xxx.ngrok.io. Pengaturan Ngrok.
1- Untuk mengekspos server menggunakan NGROK;
- Kemudian salin URL NGROK di server yang sedang dijalankan
- CD Klien dan Tempel Ngrok_url di .env Under ./client
- Sekarang koneksi dengan klien dipastikan
NGROK_URL = "http://_______.ngrok.io"
2- di terminal yang berbeda;
Di paruh pertama terminal
$ cd Client
$ npm install (to install client-side dependencies)
$ expo r -c
Di paruh kedua terminal
- server CD dan atur variabel lingkungan di config.env di bawah ./config/env
- Buat URL Koneksi MongoDB Anda, yang akan Anda gunakan sebagai mongo_uri Anda
- Memasok kredensial berikut
# --- Config.env ---
NODE_ENV = development
PORT =5000
MONGO_URI =
JWT_SECRET_KEY =
# --- Terminal ---
$ npm install (to install server-side dependencies)
$ npm start (to start the server)
Fitur utama
- ✔️ Pendaftaran dan login pengguna
- ✔️ Otentikasi menggunakan token JWT
- ✔️ Favorit, komentar dan tambahkan produk ke troli
- ✔️ Pilih produk sesuai dengan informasi warna dan ukuran dan tambahkan ke dalam keranjang
- ✔️ Menampilkan produk terbaru yang telah Anda lihat dan rekomendasi produk serupa
- ✔️ Halaman kategori produk dan tampilan subkategori
- ✔️ Cari produk berdasarkan nama, merek, dan kategori
- ✔️ Meningkatkan, mengurangi atau menghapus jumlah setiap item di dalam keranjang
- ✔️ Menerima pesanan dengan memilih alamat pengiriman dan kartu bank
- ✔️ Halaman detail yang menunjukkan semua pesanan yang ditempatkan dan status terbaru produk (waktu pengiriman, tanggal pengiriman) untuk setiap pesanan
- ✔️ Email dan kata sandi mengubah halaman
- ✔️ Perhatian diberikan pada penanganan kesalahan
- Lupa halaman kata sandi dan reset kata sandi
- Menambahkan foto ke komentar
- Masuk dengan akun Google
- Membuat halaman khusus untuk setiap merek
- Penambahan Sistem Pembayaran (Stripe)
- Permintaan kadang -kadang diproses secara perlahan dan menyebabkan masalah ketika mereka dipecat pada saat yang sama (bisakah arsitektur layanan mikro menjadi solusi?)
Teknologi digunakan
Proyek ini dibuat menggunakan teknologi berikut.
Frontend (Mobile)
- React JS - Pustaka JavaScript yang digunakan untuk membangun antarmuka pengguna khusus untuk aplikasi satu halaman
- React Hooks - Untuk mengelola dan memusatkan keadaan aplikasi
- React Native - Kerangka pengembangan aplikasi seluler lintas platform
- React Navigation V6 - Routing dan Navigasi untuk Expo dan Bereaksi Aplikasi Asli
- Axios - Untuk melakukan panggilan API
- React-Native-Bouncy-Checkbox
7.2.1 - react-native-element-textInput
2.2.0 - react-native-gestur-bottom-sheet
1.1.0 - react-native-indikator
0.17.0 - react-native-modal
13.0.1 - react-native-popup-menu
0.16.1 - React-progress-progress
5.0.0 - React-Native Ratings
8.1.0 - react-native-safe-are-context
4.4.1 - react-native-simple-dialogs
1.5.0 - React-Native-Step-Indicator
1.0.3 - react-native-toast-message
2.1.6 - React-TextArea-autosize
2.1.6
Backend
- Node JS - Lingkungan runtime untuk membantu membangun aplikasi server cepat menggunakan JS
- Express JS -Server untuk menangani dan perutean permintaan HTTP
- Mongoose - Untuk pemodelan dan pemetaan data MongoDB ke JavaScript
- Express-Async-Handler-Middleware sederhana untuk menangani pengecualian di dalam rute Async Express dan meneruskannya ke penangan kesalahan ekspres Anda
- jsonwebtoken - untuk otentikasi
- bcryptjs - untuk enkripsi data
- DOTENV - Modul Ketergantungan Nol yang Memuat Variabel Lingkungan
- Multer - Node.js Middleware untuk mengunggah file
- CORS - Menyediakan middleware Connect/Express
- uuid - untuk generator id acak
Database
- MongoDB - Ini menyediakan layanan cloud gratis untuk menyimpan koleksi MongoDB.
Mockups

















Pengarang
Lisensi
Copyright 2023 Muhammet Yıldız
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
https://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
Video Proyek
Hizlisepet.mp4