Personal Trainer Web Applicaton [Using Angular + .Net 8 + MSSQL + Google API + MAILJET API + OPEN AI GPT MODEL API + PAYPAL API + IDENTITY FRAMEWORK + HTTP ONLY FLAG + JWT]
The web application for a personal trainer is a tool designed to facilitate the management of workouts, nutrition plans, and communication with clients. It enables trainers to effectively plan and monitor the progress of their clients, delivering personalized workouts and nutrition plans.
- Creating personalized training plans: Admin Panel allows create training plan for user, who bought training offer.
- Diet Planning: Connection with OpenAi Api allows you to propose a menu with macronutrients.
- Monitoring: You can see your total revenue, your total income per day in last week, number of users and most frequently selected training offers
- Paypal payments: Transaction is created after using Paypal payments
- Google API: Everyone can use your own Google account for log in into your trianer system.
- MailJet API: If users create accounts on your website, mailjet is sending verification email.
Before running your Angular + .NET application with an MS SQL Database, make sure you have the following software installed:
-
Node.js and npm:
- Download and install Node.js from nodejs.org.
- npm (Node Package Manager) is included with Node.js.
-
Angular CLI:
- Install Angular CLI globally using the following command:
npm install -g @angular/cli
- Install Angular CLI globally using the following command:
-
Visual Studio or Visual Studio Code:
- Download and install Visual Studio from visualstudio.microsoft.com.
- Alternatively, you can use Visual Studio Code (code.visualstudio.com).
-
.NET SDK:
- Install the .NET SDK from dotnet.microsoft.com.
- Verify the installation by running:
dotnet --version
-
SQL Server:
- Install Microsoft SQL Server. You can use the free SQL Server Express.
- Set up a new database and take note of the connection string.
Now, let's set up your Angular + .NET application:
-
Angular Application:
- Navigate to your Angular project folder.
- Install project dependencies using:
npm install
- Start the Angular development server:
ng serve
-
.NET Application:
- Open your .NET solution in Visual Studio or Visual Studio Code.
- Configure the database connection string and other services in your
appsettings.jsonorappsettings.Development.jsonfile. Example:appsettings.json:{ "Logging": { "LogLevel": { "Default": "Information", "Microsoft.AspNetCore": "Warning" } }, "AllowedHosts": "*", "ConnectionStrings": { "DbConnection1": "Your Connection string to DbUsers", "DbConnection2": "Your Connection String to TrainerSystem" }, "JWT": { "Key": "Your JWT KEY", "ExpiresInDays": 100, "Issuer": "http://localhost:5118", "ClientUrl": "https://localhost:4200" }, "MailJet": { "ApiKey": "Your Api KEY", "SecretKey": "Your Secret Key" }, "Email": { "From": "Your eamil sender @gmail.com", "ApplicationName": "Your App Name", "ConfirmEmailPath": "account/confirm-email", "ResetPasswordPath": "account/reset-password" } } - Configure OpenAi. Go to
OpenAiController.csand paste your API Key:string apiKey = "Your Open AI KEY";
- Configure Google API. Go to
login-google.component.tsand paste your client ID:client_id: 'Your Google client ID', - Configure Paypal API. Go to
payment.component.htmland paste script with your client ID:<head> <script src="https://www.paypal.com/sdk/js?client-id= YOUR PAYAPL KEY"></script> </head>
- Run the .NET application using the IDE or with the command:
dotnet run
-
Run Sql scripts from
SqlScriptsdirectory:DbUsers.sqlTrainerSystem.sql
-
Angular + .NET Integration:
- Ensure that your Angular application is configured to make HTTP requests to the correct API endpoint provided by your .NET application.
-
Database Integration:
- Ensure that your .NET application is configured with the correct connection string to connect to your MS SQL Database.
-
Run Angular Application:
- Access the Angular application in your web browser at
http://localhost:4200.
- Access the Angular application in your web browser at
-
Run .NET Application:
- Access the .NET application at the specified API endpoint (e.g.,
http://localhost:5000orhttps://localhost:5001).
- Access the .NET application at the specified API endpoint (e.g.,
Your Angular + .NET application with an MS SQL Database should now be up and running. Make sure to handle CORS settings, authentication, and authorization based on your application's requirements.
Feel free to adapt the instructions based on your specific project structure and configuration.
- Database
DbUsers
- Database
TrainerSystem
We welcome community engagement and contributions from other developers to enhance the development of this project. Below, you'll find information on how you can contribute to our application:
If you come across a bug or issue in our application, please create an issue in the "Issues" section. Ensure that you provide a detailed description of the bug, reproduction steps, and the expected behavior.
If you have an idea for a new feature or an improvement to an existing one, use the "Issues" section to share your proposal. Try to describe the feature clearly and include any details you find relevant.
We accept pull requests! If you wish to add a new feature, fix a bug, or make any other contribution, we appreciate you submitting a pull request. Make sure that:
- Your code complies with our coding standards.
- You clearly describe what your pull request introduces.
- You've tested your changes and ensured they don't introduce new issues.
Using photos from: