fsiwi-hka / iwi-website Goto Github PK

Node 16 has reached end of life. Get the build running with a newer node version and update the github actions node version.

Currently the internal of the old website is still in use.
The content should be migrated, deleted or covered otherwise that the old internal space is no longer necessary.

When accessing e. g. https://iwi-hka.de/scripts/email.php?address=sponsoring I get a 404 instead of a redirect to the appropriate e-mail address. Somethig seems to be misconfigured on the server or the file is really not present. Could you please investigate @milbegreif ?

The access management for the internal space of the new website needs to be clarified and implemented.

• clairify access managment
• implement access management

The link in the calenderbox is not click-able, neither in the description nor in the location field.

Build NextJS on PR to check whether there are any errors using Github Actions

P.S: Can do it myself 😄

I'm not sure if we want to have mailto:-links or plaintext mailadresses on the website since these make it easy for spam-crawlers to add our new domain to their lists.

I would suggest to have them "masked" somehow or only provide them in some kind of form like recipient [at] domain [dot] tld so that they have to overcome at least a small hurdle 🤔

Update 2020-09-15:
After discussing in our tweekly, we decided it would be the best to go for a dynamic spam prevention using javascript or php including encryption of some sort.
An example of this would be the implementation on the University website, for example this element:

<a href="javascript:linkTo_UnCryptMailto(%27ocknvq%2CockndqzBju%5C%2Fmctnutwjg0fg%27);">
mailbox<span style="display:none">spam prevention</span>@hs-karlsruhe.de
</a>

although I'm not sure if having the adress as text displayed kind of contradicts the idea again since some spam-crawlers are not as dumb as one would think...a better idea might be to display the mailadress as a picture which contains a clickable link and using an alt-tag describing what happens when clicking on the link (regarding accessibility etc.)

Acceptance criteria:

• no plaintext mail-adresses on the website anymore
• generate the mailto:-links dynamically on the serverside using e.g. javascript or php after clicking
  • use some kind of encryption to introduce another level of security

Currently the calender on the home page of the website does not refer the current day.

To Reproduce:

• open the homepage https://iwi-hka.de/
• scroll to the calender

Actual:

• calender shows events of some day
• click on the current day
• calender shows events of current day

Expected:

• calender shows events of current day

It is the 21th april 2021 and this day is marked like there is an event on this day.
But it is not shown directly

We were provided with three links that would go nicely with the sports section of the FAQ page "Außerhalb des Studiums". We cannot post them online, but we should add information about them there. They can be found in the internal space of the old website.

Probably through the build the company images do not get displayed properly:

Expected:

Got:

Came up after: #154
cc. @dustinsommerfeld

In the Erstiinfo-page, we write about our "hidden" services, which are only available if the students sign up/in. Unfortunately, there is no link yet that points to these services.

Add calendar entries as a list, so that you quickly have an overview of the next events. I think it is best to place it to the right of the current calendar.

Both locally and in GitHub Actions, the npm run build command fails because the asynchronous call to the Google Calendar API fails. It's not an issue with the service account, we double-checked and replaced the credentials.json file.

Surprisingly, this doesn't occur when using npm run dev, the calendar data loads just fine in this case.

Needs further investigation. We fixed it temporarily by disabling the calendar integration altogether in #98 - if the issue is fixed, this commit can just be reverted to restore the calendar feature.

Issue Detail:

Error: Not Found
    at Gaxios._request (/home/runner/work/iwi-website/iwi-website/node_modules/gaxios/build/src/gaxios.js:127:23)
    at process._tickCallback (internal/process/next_tick.js:68:7)

Unfortunately, this is not very helpful...

If the browser blocks JavaScript, browsing to the https://iwi-hka.de/faq/ page only displays the file content of the folder instead of rendering the appropriate html page.

Thanks to @Lycentzia for reporting this!

See #101

There are many old information hold in the old internal space.
There should be a triage regarding this information.

Questions regarding this:

• Which information is outdated?
• Which information is covered by other documents or tools?

• Check all pages to have responsive
• Use flexbox or css grid

As discussed in the workshop.

F.ex: Prüfungen page.

We want to have nicely rendered links with images when our pages are shared on social media. For this to work, we need OpenGraph and Twitter Card meta data in our header. Some basic OpenGraph tags already exist, but they need to be extended and also use custom information per page.

Further information and testing:

• https://opengraphcheck.com/
• https://developer.twitter.com/en/docs/tweets/optimize-with-cards/guides/getting-started

Acceptance criteria:

• OpenGraph data includes appealing title, site_name can stay the same, and custom description per page (most likely from Frontmatter data with fallback to a sensible default)
• Twitter shows a card when sharing a link (must especially hold for news posts)

Since PHP 7.2 has reached EOL (-> click ), we should probably upgrade to PHP 8.

The site is static and therefore needs to be rebuilt on every content change. This should be automated. Most likely, GitHub Actions can be used to achieve this.

Possible steps:

• build (npm run build)
• deploy (FTP upload or similar)

Alternatively, we could use netlify and just let the Domain point there. (This would free us from worrying about Server Management, at least for this public part of the website).

Acceptance Criteria:

• It was evaluated which approach we want to use (GitHub Actions vs Netlify)
• The chosen approach was implemented
• The approach was described in the deployment documentation

The exxeta and gameforge cooperation logos are too big and not in the actual design.
Since new logos need to be added in the future, it would be great if the logos are smaller.

Currently:

Expected:

r.

Should we add the newly announced code scanning feature to our action workflow?

Currently waiting for the design before implementation.

The website is currently displayed correctly only on large screens. While it is somewhat usable on phones, we need optimization, especially:

• mobile menu (most likely burger menu)
• correct display of the headers (correct format of the background image)
• pleasant font size / typography for small screens
• no weird horizontal scrolling

This list can be extended.

Implementation is expected to use Tailwind classes: https://tailwindcss.com/docs/responsive-design

Acceptance Criteria:

• site is optimized for mobile using Tailwind
• tested on a few different device types (tablets, iOS/Android etc.)

The new Zoom link for the FS Meeting dosn't fit into the calender box.

• Search feature for the internal pages
• Combine with next cloud content?

As discussed in the workshop

Beobachtung: Mir ist aufgefallen, dass der Kalender an einem Tag mit Eintrag diesen erst anzeigt, wenn man aktiv auf ihn klickt...wenn man die Startseite aufruft, bekommt man den (falschen) Hinweis, dass keine Veranstaltung stattfinden würde.

Gewünschtes Verhalten: Veranstaltungen am aktuellen Tag sollten direkt angezeigt werden.

The contents should be based on:

• https://www.hska.info/vorkurs
• https://www.hska.info/erstiinfos

The pages should link to each other. Documentation entry point: https://github.com/fsi-hska/iwi-website/blob/master/docs/content.md

Acceptance Criteria:

• Two pages were created.
• Content created/copied and unified.
• There is a menu entry "Erstis" that links to the page "Erstiinfos".

Button mail address Sponsoring on site: https://iwi-hka.de/unternehmen/ not changed.

Create page for Login behind account icon.

Solve dependency vulnerabilities by updating dependencies if possible

The homepage currently displays only the last four news posts, sorted by date. While this is desired behavior, all other news posts that are older cannot be accessed through a link - you need to know the URL. We need a archive page that:

• lists all news post in chronological order
• is paginated or implements lazy loading (e. g. max. 10 entries per page/load to not overwhelm the user)

The archive page should then also be linked from the homepage underneath the most recent posts, e. g. "Ältere Beiträge im Archiv".

Entry point might be: https://vpilip.com/how-build-simple-pagination-in-nextjs/ (we no not have a backend API however, this is replaced by our MarkdownLoader. Also, we do not want to dynamically load new pages, but prerender them.)

Acceptance Criteria:

• there is a new page with the URL /archive that lists all news posts in chronological order
• the page is paginated, e. g. /archive/2 lists news posts 11 to 20 or implements lazy loading
• the homepage contains a link to the archive

Since the location of the host machine has changed, the corresponding secrets should be updated so that the correct version of the deployed website gets the most recent information.
Also, we should switch to sftp instead of ftp.

Acceptance criteria:

• The deploy action uses sftp
• The necessary secrets point to the new host machine.

We should add a page, where we can put links referenced in our Instagram posts and stories (like linktr.ee), so we don't need to always change the link in the profile

I don't know if this is intentional or not, but the calendar is only showing entries starting from the present day. I think it would be nice to be able to look at events in the past.