Repository for the WeLearn project. The idea is for it to be a platform where everyone can share their self-made lectures/lessons and learn from the other ones available. Primary focus is on students in primary/secondary school and respectively, their teachers.
- Administrator user role, only select few are in it and can moderate a large part of the contents, regardless if particular one is their creation or not - creating, reading, updating, deleting (soft and hard deletion).
- Lessons - creating, reading, updating, deleting, reporting, sending to email. Every lesson has files (in a zip archive), video material, category and appropriate grade attached to it that can be changed. There is an option for the lesson to be sent to a particular email address using SendGrid. An lesson is not publicly accessible through "View all" and "All categories" if it hasn't been approved by the administrators. Users can soft delete their lessons, but hard deletion option is given to administrators only.
- Comments - creating, reading, updating, deleting, reporting. Comments are related to a particular lesson. Users can soft delete their comments, but hard deletion option is given to administrators only.
- Reports - creating, reading, updating, deleting. An user can report a comment or a lesson. Users can soft delete their reports, but hard deletion option is given to administrators only.
- Live chat using SignalR, it is cleaned automatically every month with Hangfire.
- Contact us page with email sending functionality realized using SendGrid.
- .NET - C#, ASP.NET Core MVC, Entity Framework Core, SignalR, ML.NET
- PostgreSQL (Microsoft SQL Server in earlier development)
- AutoMapper
- Hangfire
- SendGrid
- Cloudinary
- Plyr
- HTML5, CSS3, Bootstrap 4, SB Admin 2
- JavaScript, jQuery, luxon
- Git, GitHub
- Heroku
- Docker
- Docker is used for containerization. The resulting images are pushed to Heroku. Server used is Kestrel.
- To build the docker image, execute
docker build -t app .
inside/src/
. - To run the docker image, execute
docker run -p 80:80 -it app
inside/src/
.
- Navigate around, create new lessons, reports, comments and moderate them through the administration.
- An user cannot edit and delete another one's comments, reports and lessons.
- The application has live chat functionality, realized with SignalR and websockets. Using Hangfire, every month the messages and chats are getting deleted/cleaned - the reason being that we can accumulate a lot of them and they are not that important.
- Username: HeadAdmin
- Password: admin_Pass123%
- Email: [email protected]
- Username: RegularAdmin
- Password: User_qwerty_1234%
- Email: [email protected]
- Username: Peter85
- Password: Peter_1234_#pass
- Email: [email protected]
- Username: #todo
- Password: #todo
- Email: #todo
For the Google Authentication option to work you need to configure it.
- In the Credentials page of the Google console (https://console.developers.google.com/apis/credentials), after creating an project, select
CREATE CREDENTIALS
>OAuth client ID
. - In the Application type dialog, select
Web application
. Provide aName
for it. - In the Authorized redirect URIs section, select
ADD URI
to set the redirect URI. Example redirect URIs: https://localhost:{PORT}/signin-google, http://localhost:{PORT}/signin-google, where the {PORT} placeholder is the application's port. Select the CREATE button. - Save the Client ID and Client Secret for use in the app's configuration -
/src/WeLearn.Web/appsettings.json
. - Make sure to change this line in
_Layout.cshtml
-<meta name="google-signin-client_id" content="your-client-id-here.apps.googleusercontent.com">
to include your Client Id.
Additional information and documentation: https://docs.microsoft.com/en-us/aspnet/core/security/authentication/social/google-logins?view=aspnetcore-5.0 https://developers.google.com/identity/sign-in/web/sign-in
For the email sending functionality to work, you need to obtain a SendGrid Api Key and create a Sender. Create your account at https://signup.sendgrid.com/ or use existing one.
From Marketing
select Senders
then Create New Sender
.
Use the email you registered with for "Reply To" and "From Email Address" - all three of them need to be identical.
Save that sender and verify it.
Change the ApplicationAdministratorEmail
value in WeLearn.Common/Constants.cs
to be your own.
From Settings
select API Keys
, then Create API Key
API Key Name | API Key Permissions |
---|---|
Your Key's Name | Full Access |
Copy your key and paste it in SendGrid:ApiKey section of the /src/WeLearn.Web/appsettings.json
file.
- Follow the link and pick the version that suits your OS: https://www.postgresql.org/download/
- You need to create an user and a database with the following credentials:
- Port: 5432
- Database: WeLearn
- Username: postgres
- Password: root
Only needed for when running the application with the Production environment switch on. Skip if you are going to run it in Developmemt only.
- You need to sign up for Cloudinary (free plan will do just fine) - https://cloudinary.com/users/register/free
- Copy your
API Environment variable
and store it for later
- Install/Update Visual Studio 2019 Community / Visual Studio for Mac, latest edition - https://visualstudio.microsoft.com/downloads/
- Add the module "ASP.NET and web development"
- Additional modules than may be required ".NET desktop development", ".NET Core cross-platform development"
- Configuring PostgreSQL - download the installer which has a version of 13.3.
- Follow the wizard, when asked about components select the 4 of them (PostgreSQL Server, pgAdmin 4, Stack Builder, Command Line Tools)
- When asked about a password, provide
root
- When asked about a port, leave it on
5432
- You don't need to proceed with the Stack Builder
- Start pgAdmin 4, create new server - from General set the name to
postgres
, from Connection set Host name tolocalhost
, set password toroot
and click Save - Click on that server and then Create, after that Database...
- Name the database
WeLearn
and click Save
- Set
WeLearn.Web
as a startup project - Build the application with Ctrl + Shift + B
- Run the application with Ctrl + F5
- Trust the certificate
Note: If you are not using Visual Studio, you may need to set an environment variable, use this
set ASPNETCORE_ENVIRONMENT=Development
- Pick your IDE / code editor of choice or install Visual Studio Code - https://code.visualstudio.com/
- Download the source code
- Run the following commands
sudo apt-get update
sudo apt-get upgrade
- Configuring PostgreSQL - run the following commands
sudo apt update
sudo apt install postgresql postgresql-contrib
sudo -u postgres createdb WeLearn
sudo -u postgres psql WeLearn
\password
root
root
-
Make sure to install the .NET 5 SDK (https://docs.microsoft.com/en-us/dotnet/core/install/linux)
-
Run the following commands inside /src/
dotnet restore
dotnet build
dotnet publish -c Release
cd WeLearn.Web/bin/Release/net5.0/publish
export ASPNETCORE_ENVIRONMENT=Development
export CLOUDINARY_URL=cloudinary://your:credentials@here
dotnet WeLearn.Web.dll
- Make sure you have some users and these users have liked moderate amount of lessons, so that the model can do it's job - at least 9 lessons liked by user, more than half of them should be liked by both of these users.
- Liking the same lessons with different users will give the best results.
- You should have some lessons liked only by the first user and some lessons liked only by the second user.
- Run the application - the
WeLearn.Web
project. - After it has started up, log in with the head administrator's account and visit the
http://localhost:5000/hangfire/recurring
page. - Run (trigger) the
GetLikesInformationJob
job. In the/WeLearn.Web/Data/
directory, a new file is created -UsersInLessons.csv
. - Run (trigger) the
TrainRecommendationModelJob
job. In the/WeLearn.Web/Data/
directory, a new file is created -WeLearnLessonsModel.zip
. Wait a bit, 30 seconds to a minute should be enough to train the model. - Run (trigger) the
GetPersonalRecommendationsJob
job.
Now, when you check your recommended lessons you will see the lessons that are most likely to be interesting to you. The model finds the users that have common interests and preferences, then recommends based on common liked lessons by two or more users.
By default the exact actions we did here are done automatically by the system itself, using cron jobs and HangFire. You generally do not have to do anything, the system takes care of this work itself.
- You can run with
ASPNETCORE_ENVIRONMENT=Production
too, but you will need to configure Cloudinary for this one. CLOUDINARY_URL
is the value we saved earlier (optional).CLOUDINARY_URL
is the value we saved earlier (optional).- For security measures, Cloudinary will not allow us to download the zip files that are getting uploaded, unless the account is permitted to. Contacting support service is required. - https://cloudinary.com/documentation/image_delivery_options#blocked_delivery_formats_for_security/.
The application should be running on the address shown in the terminal's output.
For Ubuntu, you may need additional codecs for playing the video files.
Some of the many resources used for creating this project:
- https://stackoverflow.com/a/59860450/13146140
- https://stackoverflow.com/a/2776689/13146140
- https://stackoverflow.com/a/48599532/13146140
- https://stackoverflow.com/questions/55832888/how-to-create-drop-down-list-from-database-in-asp-net-core-mvc
- https://www.youtube.com/watch?v=Bmm9X-YZtG4
- https://www.youtube.com/watch?v=5iN1jhr6yQI
- https://www.youtube.com/watch?v=gQMT4al2Grg
- https://www.youtube.com/watch?v=Hy9G30nncMM
- https://alexcodetuts.com/2019/05/22/how-to-seed-users-and-roles-in-asp-net-core/
- https://stackoverflow.com/a/57440303/13146140
- https://www.softwaredeveloper.blog/multi-project-dotnet-core-solution-in-docker-image
- https://www.youtube.com/watch?v=msRJdf5AfoI
- https://www.xsprogram.com/content/multiple-radio-button-groups-in-mvc-4-razor.html
- https://www.youtube.com/watch?v=dluB5VE1m1k
- https://github.com/NikolayIT/ArtificialIntelligencePlayground/tree/master/ML.NET/Recommendation/SoftUniCoursesRecommendation
- https://www.w3schools.com/howto/howto_css_custom_checkbox.asp
- https://www.npmjs.com/package/@joeattardi/emoji-button
- https://www.youtube.com/playlist?list=PL3_YUnRN3Uhiz2HomrXKcaEW6b3pDhKTX
Structure influenced by:
Videos, images from https://pexels.com and https://unsplash.com
- Login, register forms/pages - https://colorlib.com/wp/template/login-form-15/
- Chat design - https://codepen.io/FilipRastovic/pen/pXgqKK & https://youtu.be/fCpw5i_2IYU