Truckpedia

CodeLab UC Davis
5 min readDec 30, 2023

Introduction

This quarter, our team had the opportunity to build a mobile application for Truckpedia, a startup that helps trucking shippers, brokers, and carriers communicate, assign loads, and provide updates all within one platform.

The Team

Project Managers — Yasmin Aref, Nitish Gourishetty

Developers — Abhimanyu Warrier, Rahul Budhiraja, Sai Praneeth Gonuguntla, Shubhuda Martha, Suparn Sathya, Yash Inani

Timeframe

October — December 2023 | 6 weeks

Tools

Development

  • React Native / React Native CLI
  • TypeScript
  • Axios
  • Metro

Project Maintenance

  • Git / GitHub
  • Jira, Notion, Slack, Canva

The Project

Our team developed a cross-platform application compatible with both Android and iOS to complement Truckpedia’s existing website. The application emphasizes key pages, including planning, timeline, and dispatch, to enhance workflow efficiency in the complex field of trucking.

Design

Truckpedia provided us with their finalized high-fidelity designs, encompassing UI elements, color schemes, and fonts. Leveraging these assets, we seamlessly integrated their visual style into the app.

Development

React Native CLI and Metro

Our application uses React Native, an open-source UI software platform developed by Meta for Android, iOS, Windows, macOS, and Web applications. To build our project, we used React Native CLI. We chose to use CLI over Expo, another common method for building React Native projects, as it allows for module support and flexibility over our build. We also used Metro as a JavaScript bundler which allowed for hot module reloading and an easier development time.

Redux

We implemented Redux to handle state management. This tool allowed us to centralize our state and logic, paving the way for a more organized, adaptable, and scalable system.

Interfaces and Components

Our primary focus was on creating customizable and reusable components. By leveraging TypeScript we designed reusable components with a high level of adaptability to maximize efficiency.

Structure

We systematically organized our codebase by separating each of our components, routes, and screens into designated folders and files. This maintainable and organized codebase not only provides us with modular components that are readily available across multiple screens but also an intuitive overall structure that is easy to pass along through various phases of development. created a cohesive and intuitive structure for our project.

Backend

We were able to communicate with Truckpedia’s backend using Axios and HTTP requests. Using JSON data, we successfully performed CRUD operations (Create, Read, Update, and Delete) and displayed accurate data on our front end.

Final Product

Our team built an application compatible with both Android and iOS to mirror Truckpedia’s already existing website, specifically focusing on the planning, timeline, and dispatch pages. These features allow for a streamlined and optimized workflow.

Home

Displays statistics for revenue, miles, and trip distances.

Planning Page

Allows users to plan trucking routes and shows all current plans.

Drivers Page

Provides a list of all drivers, their status and profile information.

Trucks Page

Displays a list of trucks along with their number and status.

Trailers Page

Gives information about trailers, specifically the type of trailer.

Dispatch

Offers a logistical view of trucks in transit as well as the pipeline for deliveries.

Challenges

Adapting to an Existing Codebase

Truckpedia already had an existing code base with many requirements and a structured framework. Due to the limited timeframe, our team had to quickly adapt to this structure.

Limited React Native CLI Experience

While our team was very familiar with React Native, we had limited react-native-cli experience as we’ve used Expo previously. Although this was a only minor challenge, our team still had to become accustomed and learn its benefits.

Takeaways

Constant Communication

Throughout the six weeks, we held weekly meetings with our partners at Truckpedia as well as work sessions with our team. Between these meetings, we found great value in constant communication. Every few days our team would send progress updates to Truckpedia over Slack so they were aware of our progress and challenges as we encountered them. This stream of communication allowed for a more transparent and coherent relationship with our clients as they were always happy to help.

Creating Reusable and Clean Code

When working with a large codebase, it is important to follow proper coding practices. Each line of code should be necessary, and the code should be properly formatted. Additionally, we created documentation for the next developers to ensure that they can adapt to the existing codebase easily. This improves the project handoff and provides a better experience for future developers.

GitHub / Source Control

We have found that it’s important to have good source control practices with informative names and videos documenting the work that has been done. Additionally, having one person from our team review features before submitting them helps prevent many mistakes.

Division of Labor

To optimize our team’s learning, we paired individuals based on their skills and interests during project development. Recognizing the value of mentorship, we matched those looking to learn specific skills, like backend development, with more experienced team members. This approach facilitated learning for both parties. Given our two-week sprints, we ensured a regular exchange of partners and experiences. This method allowed us to break down the project roadmap into manageable tasks, promoting individual growth and contributing to ongoing project progress.

We are Never Alone

Throughout this project, we found that someone was willing to help at every turn. Our supportive team at CodeLab and our hands-on mentors at Truckpedia were always willing to go the extra mile to help us overcome blockers.

Final Thoughts

We are grateful to Truckpedia for providing us with the opportunity to work with them and for their mentorship and ongoing support throughout the six weeks. We would like to extend special thanks to Vinicius, Vikas, and Hitesh, whose support as developers was invaluable. We would also like to express our gratitude to Zhaoxing and Justin for connecting us to Truckpedia and for their behind-the-scenes work. We sincerely appreciate the entire team at Truckpedia.

--

--

CodeLab UC Davis

CodeLab is a student-run software development and UX design agency at UC Davis.