This project is a "render" of a mobile app designed as a webpage with a React.js frontend Javascript library and using Semantic UI React as a UI toolkit.
To start developing on the project, a few things need to happen. First, you need to install node.js, a javascript runtime. To do this, do the following based on your system:
Visit the following link to download and setup node: https://nodejs.org/en/download
Follow the same instructions as the Windows users by visiting the link above or if you prefer to use the terminal, do the following.
In the terminal, use homebrew to install node using the following command:
brew install node
In the terminal, run the following commmands to install the proper packages:
sudo apt install nodejs
sudo apt install npm
To verify you have the proper installation, you can run the following:
node -v
npm -v
Your output should be similar to the following:
v19.8.1
9.6.2
Once you have installed npm, you can go ahead and start downloading all of the packages we need for this project. To do so, first, make sure you are in the project folder and run the following command:
npm install
This may show some warnings, but those can usually be ignored. This command looks at the package.json
file and finds all of the dependencies of the project and installs them all down to the proper version.
Now that all the proper pacakges are installed, you're all set to start developing. To run the app, all you have to do is cd
into the project directory and run the following:
npm start
This command will start the project and open it at localhost:3000
. Once this is open, the project is live, so you can make changes in your preferred text editor and after saving the files, the page will re-build in real time.
When running the app, you will also see an output from the linter, which will check your code for warnings or errors.
When it comes time for us to make a submission, we need to do so with a production build of the App that doesnt require anyone to follow the above steps. To do this, we will run the command:
npm run build
This command creates a distribution copy of our App in HTML/JS/CSS and places it in the dist
directory. In this directory, you will see all a file index.html
as well as a bunch of other supporting files. To give others this distribution copy of the App, simply send them the dist
directory and they can open index.html
in their browser to see the app for themselves.