Code Monkey home page Code Monkey logo

web-app's Introduction

ReCodEx

Build Status styled with prettier GitHub release COPR

Installation

The web application requires NodeJS 20.x server as a runtime environment. This runtime is needed for executing JavaScript code on server and sending the pre-render parts of pages to clients, so the final rendering in browsers is a lot quicker and the page is accessible to search engines for indexing.

But some functionality is better in other full-fledged web servers like Apache or Nginx, so the common practice is to use a tandem of both. NodeJS takes care of basic functionality of the app while the other server (Apache) is set as reverse proxy and providing additional functionality like SSL encryption, load balancing or caching of static files. The recommended setup contains both NodeJS and one of Apache and Nginx web servers for the reasons discussed above.

Stable versions of 6th and 8th series of NodeJS server are sufficient, using at least 8th series is highly recommended. Please check the most recent version of the packages in your distribution's repositories, there are often outdated ones. However, there are some third party repositories for all main Linux distributions.

The app depends on several libraries and components, all of them are listed in package.json file in source repository. For managing dependencies is used dependency manager yarn, which has to be installed separately. To fetch and install all dependencies run:

$ npm install yarn -g
$ yarn install

The app is built into self-contained bundle for NodeJS server. There is a prepared SystemD unit file for control over the app. Another option is to use pm2 process manager, but we had some problems with it (it won't automatically start on boot on one of our computers for no reason).

RPM package

For Linux systems with RPM packages (CentOS, Fedora) we provide prebuilt packages. They install production bundle to /opt/recodex-web directory. Provided unit file can be used to run the app with SystemD. The app itself do not care about certificates, so it is recommended to use the app behind reverse proxy of your choice.

Environment variables

Create a .env file in the root directory and put environment variables into this file. Look at .env-sample file for an example settings. The .env file should not be published in the git repository. Environment variables are aplied before build of the app, so they cannot be changed on finished bundle.

Supported variables and their default values

NODE_ENV=development
WEBPACK_DEV_SERVER_PORT=8081
LOGGER_MIDDLEWARE_VERBOSE=false
LOGGER_MIDDLEWARE_EXCEPTIONS=true

Configuration

Compiled bundle properties can be modified by runtime configuration file. The file is located in etc/env.json file. New values of these properties are applied after restart of the app. Note, that all these values are directly accessible to JavaScript code in browsers, so it is not a good place to store any kind of secrets.

Sample content of this file is following:

{
  "PORT": 8080,
  "API_BASE": "https://recodex.base.domain/api/v1",
  "TITLE": "ReCodEx",
  "SKIN": "green",
  "URL_PATH_PREFIX": "",
  "PERSISTENT_TOKENS_KEY_PREFIX": "recodex",
  "ENVIRONMENTS_INFO_URL": "https://github.com/ReCodEx/wiki/wiki/Runtime-Environments",
  "ALLOW_LOCAL_REGISTRATION": false,
  "EXTERNAL_AUTH_URL": "https://some.other.domain/cas/",
  "EXTERNAL_AUTH_SERVICE_ID": "id-from-core-api",
  "EXTERNAL_AUTH_NAME": {
    "cs": "Univerzitní login",
    "en": "University login"
  },
  "EXTERNAL_AUTH_HELPDESK_URL": "mailto:[email protected]"
}

Meaning of individual values:

  • PORT - On which port the node.js express server listens.
  • API_BASE - URL of API to which the frontend is connected.
  • TITLE - Prefix for the web page title.
  • SKIN - Which skin color of the AdminLTE should be used. This is only a color suffix (e.g., green or primary).
  • URL_PATH_PREFIX - If the ReCodEx is not placed in the root path of the current domain, the path prefix should be placed here. This also allows running multiple ReCodEx frontends on one domain.
  • PERSISTENT_TOKENS_KEY_PREFIX - Prefix used for security token identifiers (in cookies or in local storage). If you run multiple ReCodEx instances on the same domain, it might be necessary to give each instance different prefix.
  • ENVIRONMENTS_INFO_URL - Link to a web page where individual runtime environments are explained (default refers to our wiki).
  • ALLOW_LOCAL_REGISTRATION - Allows or disables different forms for registration. Note that this configuration should match which registration types are supported by the API.
  • EXTERNAL_AUTH_URL - URL of external authentication service (that implements ReCodEx protocol).
  • EXTERNAL_AUTH_SERVICE_ID - Identifier (name) of the external authenticator as specified in core-api configuration (and in database).
  • EXTERNAL_AUTH_NAME - Caption (string) or object with localized captions (keys are locales) of the service (will be displayed in UI).
  • EXTERNAL_AUTH_HELPDESK_URL - URL for a link that is displayed in case CAS registration fails. The URL may be either mailto: URL (with email to tech support) or http(s): URL leading to a web page where help can be found.

Usage

The application can be run in two modes, development and production. Development mode uses only client rendering and tracks code changes with rebuilds of the application in real time. In production mode the compilation (transpilation to ES5 standard using Babel and bundle into single file using webpack) has to be done separately prior to running. The scripts for compilation are provided as additional npm commands.

  • Development mode can be use for local testing of the app. This mode uses webpack dev server, so all code runs on a client, there is no server side rendering available. Starting is simple command, default address is http://localhost:8080.
$ yarn dev
  • Production mode is mostly used on the servers. It provides all features such as server side rendering. This can be run via:
$ yarn build
$ yarn deploy  # copies all neccessary files to prod/ directory
$ cd prod
$ node bin/server.mjs

Both modes can be configured to use different ports or set base address of used API server. This can be configured in .env file in root of the repository. There is .env-sample file which can be just copied and altered.

Documentation

The description and documentation of the project is placed in the global wiki of the ReCodEx project.

web-app's People

Contributors

bigethan avatar dependabot[bot] avatar janbuchar avatar krulis-martin avatar medovina avatar mnaukal avatar neighborhood999 avatar neloop avatar plavit avatar sejsel avatar semaicze avatar simonrozsival avatar svnm avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

web-app's Issues

Use more sensible date format

When entering deadlines for assignments, the web app requires time in 12-hour format. A 24-hour format would be much more practical. (BTW, did you consider using ISO 8601 date format [YYYY-MM-DD]?)

Feature Request: Improve UX for commenting on particular piece of code

As a supervisor, I would like to comment on specific lines of the submitted source code, e.g., when student uses a particularly bad construction or manually implements something which is already available via standard libraries. The current system allows commenting on the solution as a whole, but in order to comment on a particular line of code, I need to close the editor, write the comment, and reference the offending code by filename and line number. Students probably face similar problems when trying to match the comment to the source code, because by opening the editor, they hide the comment section....

Ideally, I'd like the commenting functionality like GitLab or GitHub have on Merge/Pull request comments. Since I would use that feature a lot, I don't mind working on it myself. But since it is a rather large change, it should be discussed before I drop a thousand-line PR.

Progress bar green despite submission failing

Issue Description

I submitted a solution and "solution is being evaluated" progress bar ended up being entirely green. Despite this, the solution was not accepted; the verdict was WA.

An example of a submission where this happened is here. The task is reinforce_with_baseline from the Deep Reinforcement Learning group.

Environment

  • OS: MacOS Mojave 10.14.2
  • Browser: Firefox 64.0

Steps to Reproduce

  1. Submit a WA solution
  2. Observe progress bar

Expected Behaviour

Red parts in the progress bar

Actual Results

Fully green progress bar

registrace přes CAS nefunguje s defaultní rolí mimo MFF

Když jsem se pokoušel registrovat účet přes CAS, ReCodEx mi tvrdil, že nejsem student ani zaměstnanec MFF, což bylo poněkud matoucí (jsem obojí). Po přenastavení defaultní role v SISu (kde jsem měl nastavené své další studium na FF) na studium MFF se registrace podařila.

V tabulce "Students and Their Results" vedou odkazy na úlohy do administrace

Issue Description

Dtto, jde o přístup ze studentského účtu. Žádná uživatelská data mi to nezobrazí (jen to naháže asi sto upozornění "Forbidden Request - Access denied). Když chci stáhnout nejlepší řešení, tak to také správně nabídne jen prázdný soubor, do "Edit assignment settings" se dostat můžu a měnit nastavení jsem nezkoušel, nechci nic rozbít.

Steps to Reproduce

  1. Přihlašte se do Recodexu pod uživatelským účtem
  2. Otevřete hlavní stránku nějaké skupiny
  3. Najděte část "Students and their results" a klikněte na název libovolné úlohy v záhlaví tabulky.

Feature request: Visual indicators of assignment state in "Students and Their Results" table

The "Students and Their Results" table on group's main page ("Group assignments and student results") provides a nice overview of student's achieved points for the supervisor. Clicking the points number for given student and assignment gives a floating window with detailed overview of all submitted solutions.

However it would be great if there was an icon indicator (or indicators) beside the points number marking that attention is needed for this particular student and assignment. In particular that

  • there is a solution that has not been reviewed yet
  • none of the solutions was accepted as the final
  • there is a new message in any of the solutions chat/comments
    In short, a way to know which of the numbers in the table the supervisor should click to get where he/she/it needs to be.

Main menu isn't opening on phones

Issue Description

Menu on the main ReCodEx page (https://recodex.mff.cuni.cz/) cannot be opened on a mobile phone and therefore users cannot log in.

screenshot

Screenshot shows that menu button is pressed but the menu is not displayed.

Environment

iPhone SE
Xiami A2

Steps to Reproduce

  1. Go to https://recodex.mff.cuni.cz/
  2. Try to open menu (three lines above another) to sign in

Expected Behaviour

Menu will open.

Actual Results

Nothing happens, menu doesn't open and I can't log in.

Can't Login

image

I can't login on my PC. But I can login through my mobile.

Feature request: Show total points below the list of assignments in group detail

Issue Description

Hello,
as a student, I think it would be nice to see total points below the list of assignments on group detail page.
Currently, I'm member of a group of about 100 people and we can see other students' results. To see my total points, I need to scroll down the Students and Their Results table / use Ctrl+F to find myself there.

Expected Behaviour

When I go to group detail, I see my total points below the list of assignments.

Actual Results

When I go to group detail, my total points are shown in Students and Their Results table. If we can see other students' results, I need to manually find myself there.

Feedback - # of submitted solutions

Hey, a counter tracking the number of already submitted solutions of an exercise would be great - right now I have to count my submissions manually.

Nefunguje vyhodnocování úloh

Připadá mi, že přestalo fungovat vyhodnocování v ReCodExu.

Odevzdat řešení lze, progressbar běží (zeleně až do konce), ale pak se nanačte stránka s vyhodnocením, ani když čekám několik minut. Když se podívám znovu přes úvodní stránku, tak body přibyly, ale není vidět odezvdané řešení. Když se z testovacího studenta přepnu na správce skupiny, tak opět nevidím řešení, ale body tam jsou. U úloh, kde bylo jiné nějaké řešení odevzdáno již dříve, se to chová myslím jinak, ale nenačítání stránky s vyhodnocením je problém i tam.

Bug

Issue Description

The page becomes unusable

Environment

MacOs Safari

Steps to Reproduce

  1. Open some task in a group
  2. Click on the top green panel and select the current group
  3. Voila

Expected Behaviour

Normal page

Actual Results

Screenshot 2021-10-09 at 10 41 54

Použití loga SO

Není použití loga StackOverflow pro paměťový limit porušením licence Font Awesome či autorského práva Stack Exchange?

Submission is counted when file upload dialog fails

When the file upload dialog fails with an error that triggers the app.submistSolution.submitFailed (sic) message, the submission is still counted.

The submission is in the following state afterwards:

Evaluation Status: Solution was not submitted for evaluation. This was probably caused by an error in the assignment configuration

Since the very same files worked on another attempt, this doesn't seem to be an error in the assignment.

[Feature request] Diffs between source code of students submissions

Hi, I recently thought of a feature I would like to be added. A often view multiple submissions of a student and it is sometimes difficult to find out what did they change with respect to the previous submission. Since the submissions mostly contain files with same names, it could be relatively easy to implement some way of viewing diff between individual submissions. Be it something like git diff or something more sophisticated, I think it would greatly improve the UX for the teachers (and maybe students too).

Getting email notifications for archived courses

Issue Description

I am getting notifications for deadline of assignments for Programming I and II which I took last year. I remember these assignments being due in next year on purpose.

Expected Behaviour

I would expect you can not get notification from archieved course.

502 Proxy Error after assignment deletion

Issue Description

When group supervisor refreshes page in browser after succesfull assignment deletion,
it waits couple of seconds and finally show the message

Proxy Error
The proxy server received an invalid response from an upstream server.
The proxy server could not handle the request GET /app/assignment/e917c528-4ff8-11eb-a1a9-005056ad4f31/edit.

Reason: Error reading from remote server

Environment

Win10, Chrome.

Steps to Reproduce

  1. Edit assignment settings
  2. Delete the assignment
  3. Refresh browser page

Expected Behaviour

Expected behaviour would be some message or return back to the page of the group.

Actual Results

Long waiting and a message after.

Snímek obrazovky 2021-01-06 112734

Nelze se přihlásit přes CAS

Issue Description

Po pokusu o autentizaci přes CAS se zobrazí:
"Server response: The ticket 'ST-446-pciaHelBwYB22FxF5tOp-cas.cuni.cz' cannot be validated as the response from the server is corrupted or incomplete."

Environment

Linux, Chrome

Joining a group results in an error

Joining a group results in a bunch of errors as illustrated on the following screenshot

recodex

Potentially important info: I am a student from FEL CVUT.

Feedback

Dobrý den,
vzhledem k tomu, že recodex je nasazen zatím asi 2-3 semestry, chtěla bych upozornit na velmi obtěžující jev, který se stane, když je student přihlášen do více skupin (což se nektěrým stalo třeba až teď v tomto semestru). Po přihlášení (či po kliknutí na "Přehled") se vždy zobrazí úplně všechny skupiny, do kterých jsem přihlášená. Nejen, že se to velmi dlouho načítá, navíc musím ještě hledat tu jednu skupinu, která je pro mě tento semestr relevantní. Skupiny se řadí vždy úplně jinak. Reálně u nás prváků určitě nastane situace, že budeme přihlášení třeba do 7 skupin a to už bude úplný horror. Vím, že se dá ze skupiny odejít, ale to z archivačních důvodů dělat nechci - budu se na ty úlohy třeba někdy chtít podívat.

Nemohli by se ty skupiny tedy automaticky po semestru nějak archivovat? Představuji si, že po přihlášení by se mi ukázaly jen skupiny tohoto semestru a ty další by byly přístupné například po roztažení nabídky "SIS Courses - Student".

Děkuji,
Kateřina Stodolová

Edit box for solution comments is too small

Issue Description

Edit box for attaching "Comments and Notes" to a solution starts with one line of text and it is automatically enlarged as I type. However, if I insert a lot of text by pasting it from clipboard, the edit box remains small.

Environment

Debian Linux (Stretch), Google Chrome 73.0.3683.75.

non MFF-student account

Issue Description

Is it possible to create ReCodEx for a student without MFF affiliation? I have CAS account, but it's from another faculty.

I would appreciate any help with this issue.

Environment

Steps to Reproduce

Expected Behaviour

Actual Results

Feature Request: Let supervisor see detailed test description for assignments

As a supervisor in a group, but non-owner of an assignment, I am able to see sections Tests and Scoring and Supplementary Files within assignment test configuration. I am however unable to see how are tests being run (i.e. command line arguments). If I duplicate the assignment, I am able to see (and modify) anything regarding tests configuration.

Would it be possible to provide read-only display of tests configuration even for non-owner?

Easy path from table of results to solution details

When I view the "Students and Their Results" table on the group overview page, I frequently wonder why the particular submission got so few points. However, it is quite hard to get from the table of results to the particular submission.

It would be nice to make clicking on the number of points lead to the page with submission details.

Wrong link in verification e-mail

Issue Description

When a new account is created user's email address is not verified. ReCodex automatically sends a verification e-mail containing a link to the recodex page, that validates user's e-mail address.

However forementioned link is wrong as it contains double slash after hostname. Thus destination URL does not exist (HTTP error 404). https://recodex.mff.cuni.cz//email-verification?eyJ0eXAiOiJKV1… should be https://recodex.mff.cuni.cz/email-verification?eyJ0eXAiOiJKV1…

I manually corrected address in my browser and it worked all right. My e-mail address is now verified.

Environment

Version 85.0.4183.121 (Official Build) Arch Linux (64-bit)

Attachments

Login through CAS doesn't work on mobile

When I try to log in through CAS on my phone, I get taken back to the main page, but when I expand the sidebar again, there is just the "sign in" button - it doesn't actually sign me in.

Android 8.1.0, Firefox 57.

Lack of evaluation log

Hi,
evaluation process in CodEx used to display evaluation logs:

Test 1... SG:Caught fatal signal 11 (SIGSEGV)

while ReCoDex displays:
image
wich I don't find very useful.

Are you planning to add such feature? Thanks

Multiple whitespace characters in Markdown inline code are rendered as one

Teachers often use inline code in Markdown to define expected inputs and outputs in assignments. The problem is, that unlike multi-line code blocks (which also add <pre>), inline code only translates into <code>.

A teacher inputs

output: `a      b`

Which is rendered as

output: a b

This has happened to me (a student) multiple times throughout my 5 semesters of study. Teachers expect the white-space to be persisted in inline code mode. As such, I think that this is undesired behavior for this project, where white-space has a lot of significance.

However, note that this behavior is in compliance with the CommonMark standard and thus it is not an issue with the markdown-it package you're using.

What I want to point out though, is this note from example 337 of the CommonMark standard:

Note that browsers will typically collapse consecutive spaces when rendering <code> elements, so it is recommended that the following CSS be used:

code{white-space: pre-wrap;}  

Adding this CSS would fix the aforementioned problem with assignments.

Can't authenticate throught CAS UK

I can't log in throught CAS even when using right credentials. the server response is

Server response: The ticket 'ST-1822-jjxOeioY1zPR1C4zlqsK-cas.cuni.cz' cannot be validated as the response from the server is corrupted or incomplete.

This is a big problem for me, I have to do some homeworks...

feature request: ICS export with deadlines of assignments

no issue at all, just a feature request

It would be nice if ReCodEx could provide a unique unauthenticated link with ICS export of deadlines of assignments for a particular user (just dates). I could mention the ICS export of class schedule in IS UK as an example.

Student then could subscribe that ICS link as a calendar into her calendar app (e.g. O365) and not to miss any deadline.

Change the date format for English language

Issue Description

It does not make sense that ReCodEx's default date format changes to "MM/DD/YYYY" when in "en" language. The only country that uses this format is the USA. All of Europe, including the English speaking parts, uses "DD. MM. YYYY".

I think it would be a good idea to either default it to "DD. MM. YYYY" for both languages or include an option to switch to "DD. MM. YYYY" even when ReCodEx is in English.

Přihlášení mobilní aplikace

(Nevím, jestli tento problém patří zde, jelikož se týká mobilní aplikace.)
Stáhl jsem si mobilní aplikaci pro ReCodEx, ale nejde mi se přes ni přihlásit na svůj účet (přes CAS). Zkoušel jsem příhlašení několikrát opakovat, ale pokaždé mě aplikace odmítne s hláškou „This password is incorrect“, ačkoli se stejnými přihlašovacími údaji se normálně přihlásím na svém laptopi přes FF prohlížeč.

Second deadline was almost 50 years ago

Not sure which repo to put this into.

Issue Description

In the deadline reminder email

"Your assignment 'walker' in the group 'Deep Reinforcement Learning' has a first deadline on 6.1.2019 22:59 and a second one on 1.1.1970 00:00. This email is just a reminder that these dates are nearing and you have not submitted any solution yet. "

Expected Behaviour

The second deadline with a clearly wrong/default value should not be shown.

Actual Results

It was shown.

Cannot copy-paste notifications

Notifications are very nice! However I'm not able to "copy paste them" ... some icon for copy-notification-to-clipboard would be very nice feature (especially for bug reporting).

I'm on Chrome, latest version.

Cheers!

CAS UK SSO not working

Issue Description

When I try to use CAS for signing into ReCodEx it produces following error:
2020-09-25 8:08 Signing to ReCodEx using UK-CAS authentication process failed. This usually means that you either do not have an account in ReCodEx yet, the account is disabled, or binding between your account and CAS identity has not been created.

Environment

Firefox @ Win10, CAS account 69074999 with roles:

  • Faculty of Mathematics and Physics, faculty
  • Faculty of Mathematics and Physics, staff
  • Faculty of Mathematics and Physics, member

Steps to Reproduce

  1. Click Authenticate through CAS
  2. Fill in login details to cas page

Expected Behavior

Login to ReCodEx

Actual Results

image

Chybi moznost se odhlasit

Po delsi dobe inactivity na ReCodexu (pravdepodobne po expiraci sessionu) je v sidebaru/draweru na miste informaci o uzivateli (.user-panel) hlasena chyba:

nepodarilo se nacist data

a v notifikacich (.notifications-menu) je hlaseno:

access token '...' is not valid

Neni vsak mozne se prihlasit znovu, jelikoz neni mozne se v tuto chvili ani odhlasit.

Jako docasne reseni, je mozne se odhlasit pomoci nejakeho parametru v URL ci neco na ten zpusob?

Already submitted always shows 0

Issue Description

When viewing students solutions for an assignment, the label Already submitted always shows 0, regardless of number of submitted solutions

Environment

MFF recodex

Steps to Reproduce

  1. create an assignment
  2. as a student: submit a solution
  3. as a teacher, look at submitted solutions count

Expected Behaviour

Already submitted shows 1 (or more, based on number of solutions submitted)

Actual Results

Already submitted shows 0, see screenshot

(from https://recodex.mff.cuni.cz/en/app/assignment/c8ee2f7d-cff4-11e8-a4be-00505601122b/user/d0ab45f1-b253-11e7-a937-00505601122b)
image

#feedback Body za úlohu ve skupině

Zdravím.
Uvítal bych, kdybych po rozkliknutí skupiny u seznamu úloh, měl napsaný získaný počet bodů a jejich maximum. Usnadnilo by to např. hledání úlohy, která je sice "👍 Succesfull", ale není za ni plný počet bodů.
:)

Problem s pridavanim do skupiny

Pokusil jsem se na svem dashbardu pridat do skupiny, kterou mam v SISu v rozvrhu. Vypada to, ze se mi to povedlo, ale stejne mi v upozornenich vyskocila hlaska "Server response: Forbidden Request - Access denied".

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.