You are on page 1of 8

Unity Growth Fund Portal

Setting up the front end:


● Log into Bitbucket using the Unity Growth credentials.
● In the repository tab, navigate to the ugf-web-fe folder.
● Then, click on the clone option and copy the link that appears in the popup.
● Create a new folder on your local system.
● Open that folder and right click, then click on show more options and click
on “open GIT bash here”.

● Then type git clone and paste the link that was copied in step 3.
● After doing this, open the command prompt in windows or the terminal if
using Macbook and have that folder’s path then type “npm install
--legacy-peer-deps” to install the required dependencies.
Running the Front end of the portal:
● Open command prompt at the ugf-web-fe folder location and type “npm run
dev”, after running wait for it to complete then copy the localhost link
present in the command prompt output and paste it in any browser as the
URL.

Some GIT commands needed to commit changes etc:


● git status : shows the status of changes etc on the current branch.
● git branch: shows current branch
● git branch -a: shows all branches in the repository.
● git checkout branch_name: switches branch to specified branch_name.
● git pull origin branch_name: pulls the current version of the code that is on
the specified version of the branch.
● git add . : add the changes to make it ready to commit to the branch.
● git commit -m “message” : commits changes to the current branch and
displays the “message” on bitbucket in the branch on that repository for
information about changes.
● git push origin branch_name: pushes all changes to current branch.
Important Points about the Unity Growth fund investment portal

● Front end code is written in JSX and backend uses loopback 4. Backend
also has tables with investor information that is written in SQL.
● Under the “Offerings” tab all current investments available to that user are
present. This tab also has Upcoming offerings, past offerings and offerings
that have been added to the watchlist for that particular user’s account.
● Under the “Portfolio” tab, first we have the investments tab which has all
the current investments of that particular investor. Then, there is the
portfolio analysis tab which has the statistics of all the investments made
by the investor. Lastly there is a tab for the capital call feature.
● Under the “Stake Sales” tab, the stake sales feature has been
implemented where an investor can make a bid on a particular fund or sell
his/her share in a particular fund.
● Under the “News” tab, all the current news that is listed on the website is
listed here.
● The bell icon shows all the notifications that particular investor has
received.
● On clicking the arrow next to the user’s name, there are four options
namely, “My profile”, “settings”, “customer support” and “logout”.
● In the “My profile” section we have all the information about the user.
● In the “settings” section, there is one section for the Account settings and
another for the investment settings. The account settings section has
options to change details of the user’s account while the investment
settings has the user’s saved investment profiles, addresses and the
user’s documents. The documents have been split into three sections
namely “user docs” which has docs uploaded by the user, the “fund docs”
which has the docs that are specific to a particular fund and the “tax docs”
which has the tax docs that have been uploaded by that user or that are
fund specific and have been signed by the investor.
● In the “Customer Support” section there is a section to send a support
query to a user, there is another section to see the FAQs for the portal,
there is a third section for the user guide which an investor can see the
user guide for the portal and lastly a section where the investor can see all
the notifications received in one place.
● Clicking the Unity Growth Fund logo takes you back to the offerings page.
● The “click for help” icons at every page once clicked will open a pop up
window with the relevant video to help the investor navigate through that
particular section.

Setting up the backend on your local machine:

1. Clone the ugf-web-be repository from bitbucket onto your local machine.
Make sure to switch to a different branch once cloned since the default
branch will be the main one. Use git checkout to switch to a development
branch.
Use: git clone <repository-url>
Then use once you’re in the root directory: git checkout <branch_name>

2. Once you are on the current branch in your local machine, open up a
terminal in the root directory of the repo and run the following code:
npm install –legacy-peer-deps.
This will install all the necessary modules needed to run the development
server.
3. Now we will have to set up the database. Unity uses a MySQL database.
Install MySQL on your system. Install the workbench also as it’s very
useful. This is a great guide on how to install MySQL server and
workbench: How To Install MySQL (Server and Workbench)

4. Create a new instance if you don’t already have one in the MySQL
Workbench and import the dummy database to it. You can ask the admin
or the dev for the dummy database. Note - you can only import the dummy
database after creating a database inside your instance. So, first create an
empty database called ‘default_db_live’(for example) using:
CREATE DATABASE default_db_live;
Then import the dummy database to it.
5. Now that you have the database and loopback 4 backend setup, we will
have to connect them. In the backend director, go to /src/datasources and
open the file named db.datasources.ts. Comment out the const config
part and add a new block config block.
6. Now, comment out everything in the rest of the files of the datasources
directory except index.ts and README.md
7. Now go to the root directory of the backend repo and run:
npm start
You won't be able to connect most probably because of some privileges
issue. You can resolve it by running these commands in the the instance
your created in your MySQL workbench or in the MySQL shell:
GRANT ALL PRIVILEGES ON *.* TO 'root'@'localhost' WITH GRANT
OPTION;
FLUSH PRIVILEGES;

8. The local server should be running now. You can try visiting the URL given
on the console to see the default page on your browser.

9. Now that your local back-end server is running, we can connect your front
end to this.
Go to your front-end repository’s root directory, and open up the .env.local
file. Change the NEXT_PUBLIC_API_BASE_URL to http://[::1]:5000/
Now you can run the front-end using:
npm run dev
You can test out whether you are truly running everything offline by turning
off your wifi and checking if your development website is stil working on
your machine.

10. Congrats! You have successfully created a local development


environment!

You might also like