• create one playground site for each page
• start populating each page with html and css
• add tailwind-ui
• find the easiest place to store and serve images

Questions to resolve:

• Will the main page be the current release with a link to "all releases" page, or will the main page directly list all releases?
• Sketch a design or select Tailwind components for each page

Some tasks:

• Implement header
• Adapt Tailwind components or draft html and css
• Define content type for releases database and populate with initial data. One approach would be to use a markdown file for each release and aggregate the front matter for all these files to create a releases list.
• Implement scripts to parse and transform release content from markdown into the desired intermediate format.

• Implement non-interactive menu for mobile and large screens
• Implement a minimal interactive menu for large screens
• Implement a minimal, interactive menu for mobile screens
• Update to match current large screen and mobile screen Figma designs (could be a few hours or two days, depending on complexity of CSS)
• Change large screen menu to use hidden instead of opacity to fix subtle issue with hidden menu capturing mouse events
• Change large screen menu to use z-order to ensure dropdown menus always appear above other content

We want to somehow make it easier to write Tailwind components. The feature we need is auto-completion for the values of their classes. A VS Code plugin might do what we want, but @kanishka-work mentioned some other possibilities.

The goal is to cut out the Tailwind playground from our dev cycle. This is a pain point.

The rescript manual notes that namespacing will become the default eventually. Enable it in bsconfig now to shake out any issues. Most likely, it will just work since we don't publish this project for other ReScript projects to use.

...

Subtasks:

• Implement sticky left nav bar (functioning in Tailwind Playground, awaiting porting to site)

Note: This is the first instance of a content heavy page with a left navigation table of contents component.

Select a procedure for installing dune, opam, and ocaml compiler, that can work reasonably fast with either Vercel, Netlify or ocurrent, so that ocaml scripts can be used as part of the build.

Once a method has been selected, use that method in the build.

EDIT (Mar 11, 2021):
The purpose of this is to enable more complex build steps, e.g. post-processing html or pulling data from an API. We want to implement a CLI tool in OCaml that would get invoked by our build.

Implement something like the following: https://docs.kontent.ai/tutorials/develop-apps/optimize-your-app/sitemaps-for-seo

(Low priority)

For each page where we have some indicator in the sitemap of a potential page, create a minimal page with the following content (if no full implementation exists):

• title
• [ ] summary
• create banner with link to playground version
• add link to figma frame in banner, if available

Update: I chose to only create these pages for links in the footer. We can create more placeholder pages for planned pages as they become reachable from pages ported from Playground pages into the Next.js pages.

$ nvm exec npx [email protected] install
Found '/Users/ashish/solvuu/ocamlorg2/.nvmrc' with version <14.15.1>
Running node v14.15.1 (npm v6.14.8)
bash: /Users/ashish/.nvm/nvm-exec: No such file or directory

using nvm use instead works around the issue

• gather requirements for translated pages in current site
• gather examples of internationalization on nextjs and rescript + nextjs pages (ocaml/ocaml.org#376)
• note findings in this issue, then close and create follow up research / evaluation tasks

Similar in structure to this component, but with categories of papers instead of categories of news.

Subtasks:

• Generalize the "other news stories" component" so that it can be used here (this will be discussed further in this issue #348)
• Define content structure for papers database and populate with sample data

Original: https://play.tailwindcss.com/mNyPy3g9Ko
Latest: https://play.tailwindcss.com/UIyUDSL5s9

• identify Tailwind components
• define content type for page
• define content type for opportunities database and populate with initial data
• create empty pages for outgoing links

Copy content and imitate the styling of the following page: https://ocaml.org/community/support.html

Convert this main content area of this page: https://ocaml.org/community/mailing_lists.html

#19 Addressed properly wrapping rescript page modules with JS. This issue involves reducing the code in each of these boilerplate files down. This example (https://github.com/reason-association/rescript-lang.org/blob/master/pages/blog/%5Bslug%5D.js) is probably the least amount of code to accomplish the same behavior. Try using that and replacing existing wrappers with that code instead.

We have a design to suggest it should be circular. Also today @avsm pointed out that it flushes right without a margin, and this can look odd in two ways: i) Firstly it is unclear sometimes if you're missing more content to the right or if that's the end of the view. ii) It appears asymmetrical at certain screen widths. See below. You can see the image goes all the way to the right of the window while all other content has a right margin.

Perhaps switching to the circular image should be considered now. It might resolve the first issue, though probably not the second.

Earlier, I encountered an issue with two modules named "Index" not being allowed. This is needed when you have subdirectories in the pages folder. I moved rescript modues to res_pages and created a symlink from each generated JS file to a renamed file within pages. This almost worked, but the hot reload does not pick up changes to a page. Instead of symlinks, use the method noted in Discord discussions for rewrapping a rescript generated JS module with another JS module.

...

Sub tasks:

• Select a calendar component for OCaml Weekly News
• Define content structure for the OCaml Weekly News database
• Download and transform the OCaml Weekly News calendar dataset and populate our database

original: https://play.tailwindcss.com/FNsNF2KjZs
latest: https://play.tailwindcss.com/WKH4f4k0L2

comments below

• Perform a spike to understand how to use highlight.js and how to integrate highlight.js with React. Consult the rescript-lang.org implementation.
• ...

Note: The list of tutorials has not been finalized. Assume that all tutorials will be ported over for now.

Should we rename this repo to next.ocaml.org, given that is the URL we are using while it is in development.

@agarwal Please enable dependabot on this repository. I believe you will find a dependabot tab on this page: https://github.com/solvuu-inc/ocamlorg2/network/alerts . The end result that I hope to see is the presence of a few automated PRs for the out of date dependencies in this repo.

vercel uses next start by default. Move to using next export (as long as SEO considerations can still be met), to decouple from next/express js server before going live with new ocaml site. This is a very low priority issue. The advantage of using next export is that it will fail the build if someone accidentally uses "getServerSideProps" and makes the site no longer a static site.

Come up with some compromise between classic yarn docs which don't specify a way to lock yarn version easily and convenient, yet verbose, method of using npx

Implement https://ocaml.org/releases/index.html in new site, ignoring layout/nav bars for now.

We should determine the desired VS Code plugins and their configurations, and encode that in a VS Code config file.

Follow the manual's guidance for adding a json schema to the bsconfig file. https://rescript-lang.org/docs/manual/latest/build-configuration#tips--tricks

The OCaml Manual is hosted on ocaml.org, and we need to style it to match the site. Also we want to enhance the rendering to include features like a table of contents in a left navbar. This might need to get split into multiple issues, but for now we think the following tasks are required:

• Understand the recent work in ocaml/ocaml#9755.
• Summarize a strategy for addressing this issue. As can be seen in the comments of the above PR, there are several decisions that need to be made.
• Generate html from the manual's source files (which might be latex or html, depending on what we decide above). A first pass could do the minimal necessary. Then we can add features like table of contents, improve the styling, etc. We are thinking of creating a tool something like ocamlorg ocaml-manual chapter1.[tex|html] that would output an .html or .res file. This tool would use the lambdasoup library.

In future, we could consider whether to modify the source of the manual itself. This was proposed as a possibility at ocaml/ocaml#9755 (comment). Note we are hesitant to start with this as it would likely delay everything above significantly.

Repro steps:

• clone
• run yarn install
• in another terminal, run nvm use

Workaround:

• close terminal, reopen, then resume with nvm use

Detailed output:

$ nvm use
Found '/home/kanishka/dev/ocamlorg2/.nvmrc' with version <14.15.1>
Error: ENOENT: no such file or directory, uv_cwd
    at process.wrappedCwd (internal/bootstrap/switches/does_own_process_state.js:129:28)
    at process.cwd (/home/kanishka/.nvm/versions/node/v14.15.1/lib/node_modules/npm/node_modules/graceful-fs/polyfills.js:10:19)
    at Conf.loadPrefix (/home/kanishka/.nvm/versions/node/v14.15.1/lib/node_modules/npm/lib/config/load-prefix.js:46:24)
    at load_ (/home/kanishka/.nvm/versions/node/v14.15.1/lib/node_modules/npm/lib/config/core.js:109:8)
    at Conf.<anonymous> (/home/kanishka/.nvm/versions/node/v14.15.1/lib/node_modules/npm/lib/config/core.js:96:5)
    at Conf.emit (events.js:315:20)
    at ConfigChain._resolve (/home/kanishka/.nvm/versions/node/v14.15.1/lib/node_modules/npm/node_modules/config-chain/index.js:281:34)
    at ConfigChain.add (/home/kanishka/.nvm/versions/node/v14.15.1/lib/node_modules/npm/node_modules/config-chain/index.js:259:10)
    at Conf.add (/home/kanishka/.nvm/versions/node/v14.15.1/lib/node_modules/npm/lib/config/core.js:338:27)
    at Conf.<anonymous> (/home/kanishka/.nvm/versions/node/v14.15.1/lib/node_modules/npm/lib/config/core.js:314:25)
internal/bootstrap/switches/does_own_process_state.js:129
    cachedCwd = rawMethods.cwd();
                           ^

Error: ENOENT: no such file or directory, uv_cwd
    at process.wrappedCwd (internal/bootstrap/switches/does_own_process_state.js:129:28)
    at process.cwd (/home/kanishka/.nvm/versions/node/v14.15.1/lib/node_modules/npm/node_modules/graceful-fs/polyfills.js:10:19)
    at process.errorHandler (/home/kanishka/.nvm/versions/node/v14.15.1/lib/node_modules/npm/lib/utils/error-handler.js:183:30)
    at process.emit (events.js:315:20)
    at process._fatalException (internal/process/execution.js:156:25) {
  errno: -2,
  code: 'ENOENT',
  syscall: 'uv_cwd'
}
nvm is not compatible with the npm config "prefix" option: currently set to ""
Run `nvm use --delete-prefix v14.15.1` to unset it.

original: https://play.tailwindcss.com/sDvt5fPLI1
latest:

Earlier attempts failed with next build producing output that doesn't apply any styles.

• research how current breadcrumb is implemented and how its populated based on the page
• imitate the behavior in a breadcrumb component
• use the new component directly within shared layout for all pages besides homepage
• use rough styling for now

Some possible areas of improvement:

• readme - 40% done
• Contributing.md - 30% done
• code of conduct - created separate issue #281
• add comments to package.json, explaining where items are used and any unusual choices - done
• add comments to tailwind.config
• add instructions for upgrading yarn, node
  • node: update engines, update setting in vercel; update nvmrc; close terminals + run make install-deps
  • yarn: update makefile, update engines value in package.json; run make install-deps
• add instructions for upgrading nextjs, react, reason-react, tailwind, postcss and other css parts. - 50% done
• add some simple manual test descriptions - done here
  ...

Remove the starter index page. Create a very minimal index page.

• consult the rescript-lang.org index page
• avoid using javascript wrapper file
• create needed components in component or common directory

I fought with this for a few hours and didn't succeed. Try again later.

We have to implement our pages in a directory called res_pages/ due to ReScript naming conflicts with having multiple files named Index.res, but eventually NextJS requires a pages/ directory. Currently we manually write a file in pages/ with some boilerplate, which points to the corresponding file in res_pages/. It should be possible to fully auto-generate the pages/ directory.

• implement in its own component
• reference from MainLayout and any other layouts that have been created
• leave final styling for a later issue

Copying content and styling from https://ocaml.org/meetings/

We have several directories with pure ReScript code (by "pure" I mean non-pages files): bindings, common, components, and layouts. It feels like too much categorization. I think we could simplify this into a single directory.

...

Subtasks:

• Spike: Style the "industrial users" using dark mode styles. Present the styled page with a new url such as /industry/usersdark.

Design is ready in Figma. It uses existing Tailwind components.

Prerequisite: #125

"industry" - markdown layout - https://play.tailwindcss.com/UIyUDSL5s9
"industry" - custom layout - https://play.tailwindcss.com/LfDQVDezf4
"around the web" - older version - https://play.tailwindcss.com/9geGPJelDv

Note: Links to latest versions have moved to https://github.com/solvuu-inc/ocamlorg2/blob/master/next.config.js#L26 . Prefix the page you are interested in with https://ocamlorg2.vercel.app/