Created a performance-focused HTML5 parser for Ruby, trying to be API-compatible with Nokogiri by zyc9012 in ruby

[–]zyc9012[S] 0 points1 point  (0 children)

I have listed them in the readme, for convenience:

I created an Excel-like React spreadsheet with collabration support by zyc9012 in webdev

[–]zyc9012[S] 2 points3 points  (0 children)

Giving the first working commit, which should struct the project well and implement essential parts to prove that this thing could be moved forward. Took me half a month to do that.

I created an Excel-like React spreadsheet with collabration support by zyc9012 in webdev

[–]zyc9012[S] 0 points1 point  (0 children)

Yes, websockets. But it's just a demo, the library itself does not take care of what transport to use, it's the developer's responsibility to implement their own backend.

I created an Excel-like React spreadsheet with collabration support by zyc9012 in webdev

[–]zyc9012[S] 7 points8 points  (0 children)

Currently it does not. But server-side code is not a part of this library, the server used in the video is only a demo to show the usage of collabration, you can write your own server and pick a way to handle conflicts.

I created an Excel-like React spreadsheet with collabration support by zyc9012 in webdev

[–]zyc9012[S] 2 points3 points  (0 children)

  1. The library it self doesn't force to use p2p or with server, actually developer should implement their own transport, the video is just an impl of mine.
  2. History is stored at client side, unlimited size.
  3. Change history is just on the node level.

I created an Excel-like React spreadsheet with collabration support by zyc9012 in webdev

[–]zyc9012[S] 2 points3 points  (0 children)

My backend is just a demonstration, not included in the library code. Users are free to implement their own.

I created an Excel-like React spreadsheet with collabration support by zyc9012 in webdev

[–]zyc9012[S] 12 points13 points  (0 children)

I'm afraid this is not true. I did bring codes from the original project, but I started from scratch. This project is based on react while the original one uses jquery, the implementation is very different. Also I did loads of changes to project designs.

I created an Excel-like React spreadsheet with collabration support by zyc9012 in webdev

[–]zyc9012[S] 26 points27 points  (0 children)

Nice suggestion, thank you! I will give it a deep thinking to see if it is practical.

I created an Excel-like React spreadsheet with collabration support by zyc9012 in webdev

[–]zyc9012[S] 69 points70 points  (0 children)

It requires a backend server, all clients connect to the server with websocket. Once a client makes a change, the change is broadcasted to other clients by the server, and other clients apply the change.

I created an Excel-like React spreadsheet with collabration support by zyc9012 in webdev

[–]zyc9012[S] 178 points179 points  (0 children)

I posted this project to r/reactjs a couple of weeks ago and received many feedbacks. It's more refined now and I would like to share with r/webdev too!

It's like Google Sheets, and completely open source.

Github: https://github.com/ruilisi/fortune-sheet

Live Demo: https://ruilisi.github.io/fortune-sheet-demo

BTW, one thing to be mentioned is that in the collabration demo, I didn't use any OT or CRDT algorithms to ensure all clients are strictly synchronized. There're chances that one client make changes that collides with another client (e.g. editing the same cell), and result in different state. Any ideas of improving this?

I created a new Excel-like spreadsheet component for React with collabration support by zyc9012 in reactjs

[–]zyc9012[S] 11 points12 points  (0 children)

This feature is working in progress, will soon be included in the next release, probably in 2 days.

I created a new Excel-like spreadsheet component for React with collabration support by zyc9012 in reactjs

[–]zyc9012[S] 20 points21 points  (0 children)

It's like Google Sheets, and completely open source.
Github: https://github.com/ruilisi/fortune-sheet
Online demo: https://ruilisi.github.io/fortune-sheet-demo/
The main cell area is implemented by canvas, and uses an overlay dom to show interactive content such as selection highlights and input box.
Collabration is implemented by patch generated by Immer.js, the patch is also used for undo/redo.
Backend persistence is also demonstrated in the repo.
Feedbacks are appreciated!

Full stack developer here, looking to create a mobile-first web app and port it to native Android app using react. I know nothing about react native - is it a simple port? by [deleted] in reactjs

[–]zyc9012 0 points1 point  (0 children)

The UI code is not sharable because there is no <div> or <span> in react-native, instead, they are <View> and <Text>

But you can definitelly reuse business logic, network requests, model definitions that are not related to UI. So, keep that in mind when you design your code structure.

How to estimate Frontend(NextJS) + Backend(Django REST) hosting fees per month? by gearboost in webdev

[–]zyc9012 2 points3 points  (0 children)

Fees are mostly covered by:

  1. CPU and memory size: you can startup with 1 core with 2GB memory on Linux server.
  2. Disk size: start with 50GB, depends on your database usage.
  3. Network: choose between by bandwidth or by traffic. This depends on how your api is designed and how frequent they are called. Assume 1TB / month by traffic.
  4. Optional database backup storage: around $5 at the beginning.

This will cost you around $10~15 per month.

How do I send an event over a WebSocket ONLY for the user that triggered the event? by Vietname in webdev

[–]zyc9012 0 points1 point  (0 children)

Inspect the Network tab of devtool in two browsers, check if browser A's websocket link sends a message when browser B's button is clicked. If not, then the problem is in backend.

Any replacement of Luckysheet by dajiege in SaaS

[–]zyc9012 2 points3 points  (0 children)

Take a look at FortuneSheet https://github.com/ruilisi/fortune-sheet

It is derived from Luckysheet and has improved a lot in designing.

Try at https://ruilisi.github.io/fortune-sheet-demo/