Web Application Case study

Developer Link

Consultation

A complimentary consultation is the first step in our web application development approach. Below you'll find the results of our conversation with Developer Link.

Project On Device(s)
Company Name: Developer Link
Location: Houston, TX
Industry: Web Development
Development Type: Web Application
Scope: Design and Development

User Stories

After the consultation we ran a story creation workshop with Developer Link. Below you'll find the results of the workshop and how the stories were prioritized.

Must Have

Index Card Background
Simple landing page with options to sign up, log in and see developer profiles
Index Card Background
A developer page to show list of all developers
Index Card Background
A profile view to see bio, location, skills, experience and education.
Index Card Background
Gravatar integration for profile images
Index Card Background
Github integration to show a user's latest repos
Index Card Background
Signup page with name, email and password
Index Card Background
Login page with email and password
Index Card Background
Every user must have a dashboard with links to edit their profile, education and experience
Index Card Background
Edit Profile Page
Index Card Background
Add Education Page
Index Card Background
Add Experience Page
Index Card Background
Post Feed for logged in users
Index Card Background
Each post to have its own comments
Index Card Background
Default Bootstrap colors for fast design

Nice to Have

Index Card Background
Profile image uploads
Index Card Background
Developer profile page user filter
Index Card Background
Ability to DM through the user's profile
Index Card Background
Signup via Google and Facebook for faster profile creation
Index Card Background
Dashboard to have a messages section to reply to DMs
Index Card Background
Quick view of Education and Experience in the Dashboard
Index Card Background
Ability to delete and modify education and experience from the dashboard
Index Card Background
Like and dislike buttons on Posts
Index Card Background
Pagination on posts
Index Card Background
Latest posts displayed on user profile

Maybe Later

Index Card Background
Login via Facebook or Google credentials
Index Card Background
Block users with inappropriate DMs
Index Card Background
Post search button
Index Card Background
Show link previews in posts and comments
Index Card Background
Post Feed categories
Index Card Background
Inappropriate content filter
Index Card Background
Admin panel to manage users
Index Card Background
Advertising capabilities
Index Card Background
Show online presence with color dot on profile images
Index Card Background
Chat bot integration to help with common profile issues

Wireframes

Developer Link required both design and development services so our design team created wireframes to show how the user stories will be integrated into the final product.

Iterations

After sizing up the stories for Developer Link, we grouped them into iterations that can can be developed and tested in a 1-2 week time frame.

Iteration 1

Week 1
  • check
    Design and development environment setup
  • check
    Asset collection and review
  • check
    Wireframe review

Iteration 2

Week 2
  • check
    Landing page design and development
  • check
    Footer design and development
  • check
    Nav bar design and development

Iteration 3

Week 3-4
  • check
    Signup page design and development
  • check
    Login page design and development
  • check
    Database development for authentication
  • check
    API endpoint development

Iteration 4

Week 4-5
  • check
    Edit Profile page design and development
  • check
    Database development for user profiles
  • check
    API endpoint development
  • check
    Gravatar Integration

Iteration 5

Week 6
  • check
    Add Education page design and development
  • check
    Database development for education in user profile
  • check
    API endpoint development

Iteration 6

Week 7
  • check
    Add Experience page design and development
  • check
    Database development for experience in user profile
  • check
    API endpoint development

Iteration 7

Week 8
  • check
    Dashboard design and development
  • check
    Added ability to delete education and experience via Dashboard

Iteration 8

Week 9
  • check
    Profile design and development
  • check
    API endpoint development

Iteration 9

Week 10-11
  • check
    Developer page design and development
  • check
    API endpoint development
  • check
    Forget Password page design and development

Iteration 10

Week 12-13
  • check
    Post Feed design and development
  • check
    Like and dislike buttons added
  • check
    Database development for posts
  • check
    API endpoint development

Iteration 11

Week 13-14
  • check
    Post Feed Comments design and development
  • check
    Database development for post comments
  • check
    API endpoint development

Iteration 12

Week 15
  • check
    Release
  • check
    Emergency support standby as website is tested with live traffic

Technologies used

Once we had the iterations laid out, we were able to choose the most fitting technologies to build Developer Link a modern, secure, and scalable web application. Here is a list of the technologies we used:

Client Side:
html5 HTML5
css3 CSS3
sass Sass
bootstrap Bootstrap
javascript JavaScript
react React
Jest
Server Side:
javascript JavaScript
node-js Node
mongodb MongoDB
Jest
Tools:
git Git
heroku Heroku

Challenges & Wins

As with most projects, Developer Link had some unique requirements that required creative solutions. Below you'll see how we approached these challenges.

Case study challenges
Tactic Apps had multiple client projects and therefore limited resources to dedicate to a big internal project.
plus

Tactic Apps wanted to give back to the community while also keeping the lights on with multiple client projects. This made it challenging to assign team members to an internal project.

Tactic Apps has developed a method to scale our team which allows new workers to onboard very quickly. This allows us to take on new projects with ease and with the same level of quality as what our clients have come to expect.

Using this scaling method, we onboarded a new team member into an existing project and assigned the DevLink project to one of our strongest developers.

Tactic Apps had a short time frame for this internal project with a large list of stories.
plus

As with most projects, our list of stories exceeded our available development time frame. Using our custom Agile Methodology, we prioritized all the stories, sized them up, and iterated through them to meet the deadline.

After iterating through the stories for our 4 month time frame, we received clarity as to what we could build. We realized that this project would resemble an MVP and decided to execute the plan.

Implementing an intricate post feed system to include emojis, gifs and video.
plus

Ideally, DevLink would have included an intricate post feed system to resemble a forum post where categories, emojis, gifs and video could be used. Unfortunately we did not allocate enough time or budget to make this happen.

Adjusting the acceptance criteria for an iteration is common in web and mobile development so we decided to practice what we preach to our clients.

Based on our time, budget, and resource availability we decided to use an MVP approach to the post feed system by building the most important functionality for communication and saving the more intricate details for the next release.

Midway through the development process we realized we forgot to add a password reset option.
plus

It's common for projects to change in size or scope as they begin to take shape. We realized midway through that we forgot to add a password reset option which in itself is not a small task to get right. It requires new API endpoints, email integration and security tokens.

We knew we could not budge on time line and budget and had to make adjustments to the scope. Fortunately the DevLink project was on track to finish early and we were able to add the password reset story to one of our iterations.

Github changed their API authentication method which unknowingly broke user profiles.
plus

Whenever we or our clients use external APIs, we all run the risk of the service changing or shutting down. Github made authentication changes after we developed and tested the user profile page which broke the repository display section.

We didn't notice this issue until after the release day. Fortunately, Tactic Apps has an emergency service for all releases which we used to patch the problem within a matter of hours.

Case study challenges

Project Results

With all iterations completed, we produced a web application{" "} that Developer Link can be proud of. Below you'll see the effort it took and the consequent results.

Team & Effort
users
1
Developers
credit
85
Hourly
calendar
4
Months

Let's build your Web Application Together

Fill in the form below and tell us about your project. Feel free to attach your NDA or any supporting documentation. We’ll get back to you within 24 hours.

phone

+1 346-268-7886

Don't hesitate to contact us.

mail

info@tacticapps.com

Please complete the form or email us directly.

location-pin

Headquarter Location

Houston, TX
77433, USA

Tactic Apps Logo
Tactic Apps

We bring your vision to life by developing modern web and mobile applications focused on the end user experience.

© All rights reserved. 2022 TacticApps.com
Contact Us
phone

+1 346-268-7886

mail
location-pin

Houston, TX
USA

Contact Us
phone

+1 346-268-7886

mail
location-pin

Houston, TX
77433, USA

© All rights reserved. 2022 TacticApps.com