TE
科技回声
首页24小时热榜最新最佳问答展示工作
GitHubTwitter
首页

科技回声

基于 Next.js 构建的科技新闻平台,提供全球科技新闻和讨论内容。

GitHubTwitter

首页

首页最新最佳问答展示工作

资源链接

HackerNews API原版 HackerNewsNext.js

© 2025 科技回声. 版权所有。

Next.js – A small framework for server-rendered universal JavaScript apps

618 点作者 montogeek超过 8 年前

39 条评论

matchu超过 8 年前
Interesting! I really like the architecture here. I think the next major opportunity for abstraction is all the server&#x2F;client detection you still have to do. Do I want `request.headers[&#x27;Cookie&#x27;]` (server), or `document.cookie` (client)? Do I want to create a fresh Redux store (server), or hook into a global one (client)?<p>It&#x27;s definitely not hard for community members to build these abstractions themselves (`cookies = (req) =&gt; req ? req.headers[&#x27;Cookie&#x27;] : document.cookie`), but some of these are going to play into major use cases like authentication, so, as Next matures, it&#x27;ll start to make sense to provide these especially common abstractions out of the box.<p>That said, these are next steps; the first release is all about showcasing the fundamental architecture, and it&#x27;s looking gooood :D
评论 #12792459 未加载
评论 #12791195 未加载
评论 #12797606 未加载
评论 #12790036 未加载
idbehold超过 8 年前
One thing that is never explained in these universal&#x2F;isomorphic react frameworks&#x2F;boilerplates is how to make a fetch() against your own server (e.g. a relative route). There&#x27;s this <a href="https:&#x2F;&#x2F;zeit.co&#x2F;blog&#x2F;next#data-fetching-is-up-to-the-developer" rel="nofollow">https:&#x2F;&#x2F;zeit.co&#x2F;blog&#x2F;next#data-fetching-is-up-to-the-develop...</a><p>But what if my component looks like this:<p><pre><code> import React from &#x27;react&#x27; export class exports React.Component { static async getInitialProps () { const res = await fetch(&#x27;&#x2F;api&#x2F;user&#x2F;123&#x27;) const data = await res.json() return { username: data.profile.username } } }</code></pre>
评论 #12792465 未加载
评论 #12791435 未加载
评论 #12792236 未加载
评论 #12791935 未加载
评论 #12792884 未加载
评论 #12791377 未加载
tyingq超过 8 年前
The split screen demo on the linked page does an outstanding job of showing how this works. Nice work.
评论 #12793839 未加载
评论 #12795616 未加载
matt2000超过 8 年前
I&#x27;m a little confused about the benefits of server side rendering. I thought the point of these js UI frameworks was to make the client do a bunch of the work? Can anyone give me some of the upsides? Thanks!
评论 #12790368 未加载
评论 #12790129 未加载
评论 #12790272 未加载
评论 #12790119 未加载
评论 #12790236 未加载
评论 #12790230 未加载
评论 #12791686 未加载
johns超过 8 年前
Here&#x27;s a sample app: <a href="https:&#x2F;&#x2F;github.com&#x2F;zeit&#x2F;nextgram" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;zeit&#x2F;nextgram</a>
评论 #12789073 未加载
kissgyorgy超过 8 年前
<a href="http:&#x2F;&#x2F;dayssincelastjavascriptframework.com&#x2F;" rel="nofollow">http:&#x2F;&#x2F;dayssincelastjavascriptframework.com&#x2F;</a>
评论 #12792528 未加载
ggregoire超过 8 年前
I like how they use the tags &lt;details&gt; and &lt;summary&gt; in their FAQ!<p><a href="https:&#x2F;&#x2F;github.com&#x2F;zeit&#x2F;next.js#faq" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;zeit&#x2F;next.js#faq</a>
评论 #12790140 未加载
ruffrey超过 8 年前
Very cool. I can&#x27;t wait to try it after five years in Node land. The people behind zeit.co are great minds in the community.<p>It is funny how concepts come and go in circles. ASP.NET offered unified client and server development, though mostly in C#. It had the nuget package manager and VS store or something, but it was never amazing and packed like npm. Partial page postbacks and page state in encrypted strings..yikes. Now we have that in redux I suppose. It is all so familiar, yet so much better now.
Mizza超过 8 年前
I love how ambitious Zeit is being, but I&#x27;ve found that their apps are not quite as polished as their shiny-packaging makes out. I certainly wish them lots of luck though!
评论 #12793257 未加载
desdiv超过 8 年前
I&#x27;m very impressed that middle-click&#x2F;ctrl-click works flawlessly. That&#x27;s increasingly becoming a rare thing on the web these days.<p>Forward and backward navigation only works up to one level. Is that a limitation of the framework or an intentional design choice?
评论 #12789623 未加载
j_s超过 8 年前
Surprised to see after 10 hours no one has mentioned intercooler.js which is a stepping-stone in the direction developers focused on the &quot;server&quot; part of &quot;server-rendered&quot; might head without going as far as Next.js.<p><a href="http:&#x2F;&#x2F;intercoolerjs.org&#x2F;" rel="nofollow">http:&#x2F;&#x2F;intercoolerjs.org&#x2F;</a><p><a href="https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=12657565" rel="nofollow">https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=12657565</a>
lucideer超过 8 年前
This looks very nice indeed. I&#x27;ve also just discovered glamor[1] via the Readme, which looks similarly nice.<p><a href="https:&#x2F;&#x2F;github.com&#x2F;threepointone&#x2F;glamor" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;threepointone&#x2F;glamor</a>
BilalBudhani超过 8 年前
This is amazing! totally reminds me of PHP days.
alasano超过 8 年前
Oh you&#x27;re still rendering JavaScript client side, how mid-2016.
评论 #12792713 未加载
anupshinde超过 8 年前
Awesome, took me like less than 10 minutes to create a basic server side newsreader app with React. Simplicity of PHP and power of React combined and brought to Node. I also like how the consolelog statements are shown in dev console
partycoder超过 8 年前
Having to put your program in a string makes it hard to edit. Syntax highlighting, static analysis and tooling in general that helps you filter problems might not work there.<p>To me, tooling is very important since software is more consistent&#x2F;reliable&#x2F;productive at simple repetitive tasks like matching parenthesis, braces, quotes... and in my case I take it further like documenting types via documentation tags and verifying that function signatures and return types match. That alone helps me save a lot of time once the code has grown over 1 kSLOC.<p>I think it should be replaced to just a filename that gets required.
NickLamp超过 8 年前
Can someone explain to me why this page uses 2 GB of memory on my machine?
jonny_eh超过 8 年前
This looks so incredibly well thought out and designed. I can&#x27;t wait to start using it!
the_duke超过 8 年前
Very intriguing concepts.<p>Especially for quickly prototyping an idea.<p>Getting a React project in place (webpack config, code structure, all the boilerplate, redux,...) swallows quite some time. And I haven&#x27;t found a bootstrapper yet that I liked.
评论 #12789831 未加载
评论 #12789959 未加载
cerved超过 8 年前
[Placeholder for complaint about JS fatigue]
desireco42超过 8 年前
I am really not into new frameworks, quite the opposite, but this is cool and I can see immediate value of this approach thanks to gif movie on the homepage.<p>Thank you for making this.
applepple超过 8 年前
How is this different from Meatier <a href="https:&#x2F;&#x2F;github.com&#x2F;mattkrick&#x2F;meatier" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;mattkrick&#x2F;meatier</a>?<p>Meatier also uses Babel, React and Node.js except that it has been around for almost a year and is already stable. They&#x27;ve already solved all the difficult issues like realtime pagination, authentication, GraphQL, etc...
评论 #12797314 未加载
jondubois超过 8 年前
This sounds great for static websites but I&#x27;m not sure if it&#x27;s a good idea for a dynamic web app where data needs to update on the screen in realtime. Some questions which come to mind:<p>What if you had a &#x27;chatbox&#x27; component which updated every time a user wrote a message; would Next.js have to resend the entire HTML for the &#x27;chatbox&#x27; component (containing the full message log) every time a message is added to that chatbox? Am I right to assume that only the affected component will be rerendered? Or the entire page has to be re-rendered (and the entire HTML of the page resent over the wire) for every change in data?<p>It sounds like a nightmare for caching: If data is updated dynamically and you constantly have to rerender components in realtime on the serverside; you can&#x27;t really cache every permutation of every component&#x27;s HTML for every data change and for every user... That&#x27;s insane.<p>Regarding CPU, it sounds like it&#x27;s going to eat up server-side performance and increase hosting costs massively! What, like 10 times 100 times? Are there any benchmarks done on performance for a typical single page app built with Next.js?<p>Then there is the latency issue...<p>Finally; if we move back to full server rendering and get rid of the need for client-side code; why would we want to stick to JavaScript?<p>I haven&#x27;t used it yet so please correct me if I&#x27;m misunderstanding something.<p>Next.js sounds great for building static websites... But so does PHP!
评论 #12796206 未加载
评论 #12796207 未加载
oelmekki超过 8 年前
I love the addition of async `getInitialProps` (more for being async than getting props, would be as fine for me as getInitialState).<p>The logic for rendering loading screen in a component can quickly get tedious and annoying, such a pattern helps having a global loading screen and still allow the component to be responsible of how to fetch its data.
alistproducer2超过 8 年前
Am I wrong in saying the appeal of this tool is it allows you to process your React app (with little or no changes to accommodate it) on the server?<p>I&#x27;ve been reading a lot about SSR lately. Correct me if I&#x27;m wrong, but wasn&#x27;t one of the points of thick clients to offload processing to the client?
评论 #12790698 未加载
avodonosov超过 8 年前
Airbnb blog post from 2013 how they share code between client and server: <a href="http:&#x2F;&#x2F;nerds.airbnb.com&#x2F;isomorphic-javascript-future-web-apps&#x2F;" rel="nofollow">http:&#x2F;&#x2F;nerds.airbnb.com&#x2F;isomorphic-javascript-future-web-app...</a>
评论 #12792310 未加载
sametmax超过 8 年前
Using the filesystem as the API has been done before, and there is a reason we stopped doing it.
评论 #12790460 未加载
评论 #12790633 未加载
评论 #12790384 未加载
Raphael超过 8 年前
Is there a reason the files are &quot;.js&quot; rather than &quot;.jsx&quot;?<p>As it stands, my text editor defaults to the JS syntax highlighting. I suppose one could make JSX their default JS syntax, but then JSX would incorrectly appear to be correct in non-React files.
评论 #12792964 未加载
评论 #12790595 未加载
评论 #12790497 未加载
评论 #12794011 未加载
评论 #12794013 未加载
johnhenry超过 8 年前
Similar: <a href="https:&#x2F;&#x2F;medium.com&#x2F;@pierceydylan&#x2F;isomorphic-javascript-it-just-has-to-work-b9da5b0c8035#.6ugq1n2eo" rel="nofollow">https:&#x2F;&#x2F;medium.com&#x2F;@pierceydylan&#x2F;isomorphic-javascript-it-ju...</a>
ranyefet超过 8 年前
This looks absolutely great! Looking forward to try it out soon
ivan_ah超过 8 年前
I like this uses the filesystem for the website structure. It reminds me a bit of dokuwiki. Very usable + easy to understand compared to configuring routes.
robertmwm超过 8 年前
Very nice, definitely excited to try this out!
ej_campbell超过 8 年前
I don&#x27;t understand why you need any client side framework. Couldn&#x27;t this all be accomplish server side with the HTML pre-fetched on the client if needed for performance? There isn&#x27;t anything dynamic about the website so it could run with zero javascript and then things like the back button after scrolling through the blog would work.<p>Why try to outsmart the browser?
评论 #12794342 未加载
kelvin0超过 8 年前
So if I understand correctly, this would &#x27;transform&#x27; Node into a web framework à la Django? Please correct me if I misunderstood. If that&#x27;s the case, how Node-Server-Render will compare to Django,Flask and other Python web frameworks?<p>Performance better on Node? Feedback from the trenches would be appreciated.
antarrah超过 8 年前
It loads pretty fast but the source code is not search engine friendly.
评论 #12790631 未加载
Kiro超过 8 年前
glamor looks interesting. Has anyone used it?
john111超过 8 年前
Off-topic, but what process are people using to make these animated demos? The command-line and browser demo on this page is so clean and crisp. Is it just a screen cap with a ton of post-processing, or is there more to it?
评论 #12790892 未加载
评论 #12790185 未加载
评论 #12789981 未加载
评论 #12790317 未加载
评论 #12790884 未加载
评论 #12790878 未加载
评论 #12790626 未加载
评论 #12790785 未加载
评论 #12790627 未加载
jgalloway___超过 8 年前
I left <a href="https:&#x2F;&#x2F;zeit.co&#x2F;blog&#x2F;next" rel="nofollow">https:&#x2F;&#x2F;zeit.co&#x2F;blog&#x2F;next</a> open in Chrome over lunch and when I came back the tab was out of memory .. so you guys will probably want to look into that. But otherwise A++
评论 #12791536 未加载
评论 #12793887 未加载
评论 #12792580 未加载
评论 #12791213 未加载
TeeWEE超过 8 年前
Javascript development on the web has become such a mess... Web apps are totally bloated, tons of javascript loaded, server side rendering for search engines. Mixing css HTML and javascript together to have a component framework that actually is run within javascript... Not within the browser engine... Its library on top of library on top of library.... Really..? W3C should come up with alternatives, that also work as mobile apps... The web has become an overengineered mess.