blitz-js / blitzjs.com Goto Github PK

• Determine how deploys will be handled
• Setup deploy job in Github actions to implement the deploy process

Setup the algolia docusaurus integration once some initial documentation is in place and we meet the requirements outlined in DocSearch's checklist.

Link to DocSearch site
Link to Checklist

• Apply to DocSearch
• Integrate DocSearch into Docusaurus once application is approved

What is the problem?

When I use the example usePaginatedQuery code in the docs (https://blitzjs.com/docs/use-paginated-query) the next button is not appearing / disappearing correctly.

The tutorial seems to have security issues that anyone can

• create and update any choices through createQuestion
• update choices with any data through updateChoice

I think it should be added a security note or a new section about how to fix the issues.

Demo in browser console:

Need to update theme switcher with new brand colors

• Using Theme UI, create new themes for light and dark mode.
• Make sure font colors are ADA compliant

This is a basic home page to help with the alpha release of Blitzjs

We want to display a little info on Blitz when you land on Blitzjs.com and some help links to getting started with the project.

• Add Brandon's Blitz demo video

• Remove Features section on home page

• Mailing List form / link out to Original Mailchimp site

• Some initial Blitzjs Copy, Use below for inspiration / just use it lol

Rails-like framework for monolithic, full-stack React apps.
The central thesis is that most apps don’t need a REST or GraphQL API. Blitz brings back the simplicity of server rendered frameworks like Ruby on Rails while preserving everything we love about React.
Additionally, Blitz is bringing other Rails goodness that’s missing in the React ecosystem like file structure and routing conventions, a really nice console REPL, intelligent code-scaffolding, and a fine-tuned out-of-the-box setup with Prettier, Typescript, ESlint, Jest, Cypress, etc.

Add CTA buttons

• Getting Started
• Help Build Blitz

The react-native docs added this awhile back. We should use it right out of the gate.

https://alexjs.com

Create alpha documentation for getting blitz up and running locally and cli commands.

• Highlight blitz cli commands
• Initial Blitz project setup

Idea from @aem:

When there's a new command added in blitz/packages/cli parse out the command and then use the built in oclif documentation to update the cli docs

We'll need all existing styles and components transitioned over to theme ui.

• Finalize aesthetics, adjust the theme, etc to include branding

• Push new main branch
• Set default branch in GH to main

We want to add a guide to our docs on how to migrate a Next.js app to a Blitz app. The main thing is replacing the next dependency with blitz, and then using blitz start and blitz build.

There's probably some edge cases here that we need to document and maybe and have fixes for (like I'm not sure if src/pages works with Blitz?)

@ryardley do you have anything to add to this?

➜ myBlitzApp git:(master) ✗ blitz -version
You are using alpha software - if you have any problems, please open an issue here:
https://github.com/blitz-js/blitz/issues/new/choose

macOS Catalina | darwin-x64 | Node: v13.11.0

blitz: 0.17.0 (global)
blitz: 0.17.0 (local)

I generated a new blitz app, uncommented the projects in the schema and I've run into some issues. If I click around on different links a lot then things just quit working for some reason and there are no errors on the console for the client or server.

I started by clicking around on some projects, then clicked Create Project. At the 25 sec mark, I clicked Edit but nothing happened. Then at the 35 second mark, I clicked on Submit and again nothing happened. The only thing I could do is visit previously viewed pages at this point. Then I hit the reload button and the app does not reload.

https://res.cloudinary.com/davljbsnb/video/upload/v1596982437/Personal/Screen_Recording_2020-08-09_at_10.11.43_AM.mov

Any ideas?

• Homepage
• Vision/philosophy page
• Blog
• Versioned docs

Once branding is complete and the website is up and running, add the blitzjs logo to the showcase page for docusaurus v2.

add the logo file here: https://github.com/facebook/docusaurus/tree/master/website/src/data/showcase
add a record in this file in alphabetical order: https://github.com/facebook/docusaurus/blob/master/website/src/data/users.js

Add these documents to docusarus and set up buttons to link to them on the home page.

• Contributing guide
• Code of Conduct
• Manifesto

On the [questionID].tsx page, it is better to use the refetch-method than the alert-method described in the Tutorial.

Create a video component for the home page and add @flybayer demo video

Some video library options:
react-player
video-react

• Set up a github action to run yarn lint on this repo

Currently the site doesn't have any open graph social images.

We need to add these so it looks good when shared on social media.

You can link to this image: https://github.com/blitz-js/art/raw/master/logo-bg-purple.png

We need to officially document the RPC specification. Most users won't need to know about this, but it is needed for advanced use cases.

Specification is described here: blitz-js/blitz#85

• Slack
• Twitter
• Open Collective
• Github

I want a top-level "Made with Blitz" page (not under /docs) where anyone can add their app or project that they have built with Blitz.

It can be some type of basic grid layout where you have an title and image that links to the project.

The theme switcher does not alternate positions consistently across different browsers.

I tested on Chrome and had the following result.

@aem Tested on firefox and had the same issue.

Expected behavior:

When the site is in light mode, the radial button should be on the left and display the sun.
When the site is in dark mode, the radial button should be on the right and display the moon.

• Theme-UI for styling and theming
• Dark mode (might be a no-op if built into docusaurus)

Some of the documentation inside the main blitz repo has been updated. We'll want to make sure we update to the latest before launching the site.

This should be one of the last steps before go live

When you want to highlight multiple blocks of code in the same code snippet there is some issue that arises. The first highlight will be displayed correctly but the second one will be off by 2 lines. The third one by 4 lines, the fourth one by 6, so it increments by 2 every time.

Add a showcase page or section to the site to show off apps and businesses using Blitz

The default docusurus Code component had support for highlighting specific lines in a code block. But we lost that when we switched to the Prism component provided by theme-ui.

However, we really need the line highlight functionality to it's easy to highlight certain changes in the tutorial.

Here's where it's used in our source code.

I don't know if the theme-ui prism component can be extended to add this? If not, then we can take the source code of the theme-ui prism component and add that directly into your codebase. Then merge in the source code that does line highlighting from the docusaurus code component.

We need a banner component at the top of the page.
Initially we'd like it to display: "Site Still In Progress"

In the future we can use it as a banner for announcements like new Blitz version releases. Any talks that are given on Blitz etc..

It should also have a close button so people who frequent the site don't have to see it all the time.

Update

If you are interested in translating this website, check out Help Us Translate Blitz Docs and Blitz Languages for more info.

Original

Who can help with Translations?

As we begin to flesh out our docs we want to be able to support as many translations as we can. And we can't do this without the help of the Blitz community. While it's still a little down the road, the tentative plan is to follow a similar implementation as the react docs. We've already had a number of folks volunteering to help out translating for various languages!

For now, I'm going to use this as a placeholder to keep a running list of people and the language they offered to help with so that we have an idea of where we're at. Feel free to volunteer in a comment and I'll update the list. If you already mentioned volunteering and I missed you, my apologies, please comment so I can get you on here. Thanks!

Languages

• Dutch
  • In progress: blitz-js/nl.blitzjs.com#1
• French
  • Yanick Bélanger (@emeraldsanto)
  • Dylan Brookes (@merelinguist)
• German
  • In progress: blitz-js/nl.blitzjs.com#1
• Italian
  • Lorenzo Rapetti (@lorenzorapetti)
• Japanese
  • In progress: blitz-js/ja.blitzjs.com#1
• Portuguese (Brazil)
  • Lucas Rosa (@lrosa007)
• Russian
  • Dylan Brookes (@merelinguist)
  • Evgenii Khramkov (@ewgenius)
• Spanish
  • In progress: blitz-js/es.blitzjs.com#1

Notes:

• https://github.com/reactjs/reactjs.org-translation

We've decided to use Theme UI as our CSS solution for the website.

We found Theme UI to be a choice that struck a good balance between Tailwind and Emotion / Styled Components. Since the community was split between both.

You can find instructions on how to install Theme UI here: https://theme-ui.com/getting-started

• Add new favicon
• Logo
• Colors
• Fonts

• Branding is graciously being done by an amazing brand designer

• Remove blog link
• Update vision link for Blitz Manifesto
• Update github link

Vercel is sponsoring our account for free hosting! So we need to add a link to them in our footer.

• Text: "Hosted on Vercel"
• Url: https://vercel.com/?utm_source=blitzjs

This feature was added by:
blitz-js/blitz#305

We'll want a canary branch contributors can add their documentation to before release in blitz. That way the documentation isn't added to the website before it's launched in the main repo.

• Update website to match final designs and branding

I think that the documentation where the anti-csrf token is stored is out of date. Assuming that localstorage means the Browser's localStorage.

• https://blitzjs.com/docs/auth

From a quick glance at the Dev tools in my browser: I would assume that the anti-csrf token is stored in a cookie - which is probably a good thing.

• Setup Github actions to build on pull request for master and push to master

Kristina Matuska will be working on the website design

Proposed Site pages / Content

• Home Page
• Docs -> Guides | Tutorials | API
• Showcase
• About -> Community | Sponsors
• Blog
• Releases
• FAQ

Design Phases

Stage 1: Start off with a detailed wire frame of the home page
Stage 2: Build out the content architecture / wireframes for the other pages with less detail than home page
Stage 3: Complete Home Page design
Stage 4: Site / Brand Style guide

• Setup initial docusaurus v2 code base

Setup footer to accommodate current status of Blitz

• Remove stack overflow link
• Add slack community link
• Update copyright
• Remove blog

Create and link mailchimp form on home page.

If we can't complete in time for alpha release, we can just link out to @flybayer original mailchimp landing page.

We now have code syntax line highlighting support. So we need to update the tutorial to use this. It'll be much easier to follow! :)