NPWD

Watch the NPWD Trailer

Monorepo structure

Apps

• phone: The React code for NPWD.
• game: Game releated scripts and code that runs on the client/server-side in FiveM.

Packages

• npwd-hooks: Hooks used throughout external apps. Mainly to communicate with npwd through custom window events.
• npwd-types: Auto-generated types from NPWD that can be used in external apps.
• database: Database configuration and classes for each app
• logger: Logging lib with winston
• config: NPWD related config functions

Standalone Information & Installation

We have designed NPWD to be generally framework agnostic, meaning that it can easily be integrated with both popular open source frameworks like ESX & QBCore or any arbitary custom framework.

For further details on this system, please refer to our installation documentation.

You will also need screenshot-basic.

Technical Stack and Development

NPWD uses React + TypeScript to form the NUI front end and uses TypeScript (V8 runtime) for game scripts. You can find more technical information regarding the development of this project on our docs page here.

Feature Request & Issue Reporting

Please open an issue/enhancement on our Github Repo. This is the best way for us to track what needs to be resolved or improved upon.

Features

• Optimized
  • 0.01 ms on idle and 0.05 while in use.
• Twitter
  • Like, reply, retweet, report and delete your own Tweets.
  • Send emojis and images directly from the phone's gallery, or from an external url. Gifs too!
  • NPWD features discord logging so all reported tweets will be sent to the configured webhook.
  • Log tweets directly to discord with configured webhook.
• Matchmaker
  • Like tinder but without all the bots. Swipe right into romance or rejection.
  • As of v1.0, there is no filter for sexual preference.
  • Don't want this app? Follow the documentation here to disable it.
• Marketplace
  • Post an ad with/without a picture.
  • Choose a picture from your gallery or from a url.
  • Features calling/messaging icons so no need to provide your number.
• Text Messaging
  • Send a message or an image taken straight from the phones Gallery.
  • Group messages
• Calling
  • Call anyone from anywhere.
• Camera
  • Take pictures of oneself or your surroundings.
  • All pictures save to the gallery where they can be retrieved with a copyable link.
  • As of v1.0, there is currently two photo modes for front/rear camera.
• Contacts
  • Add a phone number to your contacts for easier access.
  • Supports up to 19 characters for phone number by default and easily changed within the
  • Gif support for avatar.
  • Quickly call, text, and with additional configuration send money.
• Notes
  • Something you want to remember in game? Make a note!
• Calculator
  • Peform calculations.
• Themes
  • Default dark theme or light theme with other themes in the works. Want to make your own? Follow our documentation.
  • Set within the Settings app.
• 6 Custom Cases/Frames
  • These cases were made by DayIsKuan
  • Set within the Settings app.
• Icon Sets
  • Change between material UI icons or our custom made icons.
  • Want to make your own? Follow our documentation.
  • Set within the Settings app.
• Notifications - Closed
  • While closed, only a portion of it will render to display a notification.
  • As of v1.0, this is currently used for calls, text and tweets.
• Notifications - Open
  • While open, all notifications occur across the top of the phone.
  • View missed notifications by clicking on the phone's header.
• Streamer Mode
  • A mode designed for streamers where images are hidden unless clicked.
  • This applies across all apps on the phone.
  • Easily set within the phone's setting app.
• Settings Configuration
  • Use a slider to set ringtone and notification alert volume.
  • Copy your phone number to clipboard for easy sharing.
  • Configure a chosen ringtone or alert sound.
  • Choose betwen twelve languages as of v1.0.
  • Change frames, icon sets and themes.
  • Adjust Zoom (100% to 70%).
  • Filter notification preferences.
• Discord Logging
  • Follow our documentation for intial setup.
  • Never used a webhook before? Follow Discord's documentation for creating a webhook.

Final words

A special thanks to all the people who have helped out with the translations! You have all been amazing.

Thanks to Ultrahacx for all the artwork and animations seen in the trailer and this post.