This is a simple image gallery application that is able to show, upload and download images from a shared local server. When the missus comes home from a trip, she can upload the images through the app and everyone with the app on the local network is able to see the images instantaneously on their phone. The images in the application are handled and stored using this ASP.NET project. The application is written with the Ionic Framework and can be built and run as a native mobile application.
This project uses Angular 13, together with Node 14.17.6, npm 6.14.15 and Ionic CLI 6.17.1. To get exact version of Node on linux, you can use nvm. If you want to use Docker features, install Docker and Docker-Compose as well.
If you want the easiest way possible to serve this application, then be sure to have Docker installed. Clone this repo and specify the server url in src/environments/environment.ts. Then, perfom these commands from the project root folder:
docker build -f docker-run/Dockerfile -t test .
and afterwards
docker run -p 80:80 --rm test
You should now be able to see the application in the browser on the url http://localhost. This will of course only work if you have a running instance of the backend as well.
The next solution is to install the project as a whole. You will need to have the correct versions of Node and npm installed on your system. We can use nvm for that and install Node v14.17.6 by typing
nvm install 14.17.6
You should now have nodejs v14.17.6 installed alongside npm v6.14.15.
Clone this repo, navigate to the downloaded folder and install ionic cli with the command
npm install -g @ionic/cli@6.17.1
Then type npm install. Follow the instructions and prompts. When finished, you can type ionic serve. A browser window should open up and show you the running application on http://localhost:8100. Use ionic serve --host IPADDRESS to make the application reachable from other devices on the same local network.
- The code itself needs a running backend, specified in src/environments/environment.ts.
If you know how to create and sign apk for Android, there is a Dockerfile and the script 'create-apk' in package.json to help you get started.
The image service does logic to create an image and folder structure in the app. To make life easier, there is a variable in src/environments/environment.(prod).ts named 'slash', which specifies whether backward or forward slash is used in the image file names. This is determined by the OS of the backend. Change accordingly.
This project implements Ionic framework, written with Angular, to create a native Android application. It uses Swiper for swipe gestures and SignalR for real-time notifications. Cypress is used for end-to-end testing.