As a part of the FlutterX Workshop Series organized by the IEEE Computer Society Student Branch Chapter of UCSC, we've built a unique travel guide application. This is a simple and user-friendly app, that functions as a travel guide which is designed to help you explore new places.
- Frontend – Flutter
Flutter is a framework that uses Dart as its programming language to create cross-platform applications with a focus on providing a rich and customizable user interface.
- Backend – PHP
- Database – MYSQL
- Android Studio
- Server Software - XAMPP/ WampServer/ MAMP
After the above requirements have been met:
- Clone the Repository inside the root directory of your WAMP or XAMPP server. This is typically www for WAMP or htdocs for XAMPP and
cd
into it.
git clone https://github.com/Buddhikanip/Flutter_workshop_all.git
cd Flutter_workshop_all
- Import the Database: Using PHPMyAdmin, import the provided database file that corresponds to the app. This will set up the necessary database structure for the application.
- Start Server Software: Make sure your WAMP or XAMPP server is up and running. This will ensure that the backend PHP scripts can be executed.
- Update IPV4 Address:
Navigate to the lib/api_connection folder within the app directory. Open the api_connection.dart file.
Inside the api_connection.dart file, you'll find a section where theIPV4
address is specified. Locate the line that mentions the IPv4 address and update it with your computer's actual IPV$ address. This is crucial for the app to communicate with the backend server.
static const host = "http://ADD IPV4 Address/Flutter_workshop_all/Backend/";
-
Press
Win
+R
to open the Run dialog. -
Type
cmd
and pressEnter
key to open the Command Prompt. -
In the Command Prompt, type
ipconfig
and pressEnter
.
ipconfig
- Under the
Wireless LAN adapter
section, look for theIPv4 Address
.
-
Open a Terminal window.
-
Type
ifconfig
(orip a
on newer systems) and press Enter.
ifconfig
ip a
- Look for the
inet
orinet addr
field under your active network interface.
Copy the discovered IPV4 address and replace the in the api_connection.dart file with it.
- Open Project in Android Studio:
Launch Android Studio and open the
Frontend
Application project.
- Configure Dependencies:
In the project explorer, locate and open the pubspec.yaml file. This file contains the list of dependencies for the app.
Open your Android Studio terminal and runflutter pub get
flutter pub get
- Select Virtual Device or Connect Device:
In Android Studio's toolbar, you will find a dropdown menu labeled
Select Device
orConnected Devices
. From this menu, you can either choose a virtual device (emulator) or connect your physical mobile device to your computer.
- Explore the App:
You can now explore the app's features by interacting with the user interface on the virtual device or your connected mobile device.
- We have inserted some dummy data into the database, you can test the app using them.
Use :
b@b.com
as the Email and123
as the Password to sign in to test.
Use :d@d.com
as the Email and123
as the Password to sign in to test.
- Else you can signup through the app and use your own credentials to test.
*If any of the lines 132
144
156
168
in the Frontend/lib/Utils/suggestionConstantBox.dart give you an error saying that SDK version is old, comment those lines and restart your application.